2

I have tried adding the following as an inline style on my <p> but outlook.com/hotmail.com strips it out and adds 1em margin to before and after <p>. 

margin-before:0!important;
 -webkit-margin-before:0!important;
 margin-after:0!important;
 -webkit-margin-after:0!important
Braiam
  • 1
  • 11
  • 47
  • 78
jojo
  • 23
  • 5

3 Answers3

3

Try this:

<p style="Margin-top:0;Margin-bottom:0;"></p>

For some unknown reason Outlook.com strips margins unless you use a capital M.

Ted Goas
  • 7,051
  • 1
  • 35
  • 42
  • Thank you. This worked for me. I set my paragraphs to Padding: 0!important; Margin:0!important – jojo Jun 27 '16 at 19:30
1

I'd say the easiest solution is to not use a p tag. Just place your copy inside a td and apply all inline styling as normal. Gives you more control over the content and saves you battling against default added styles from clients/browsers

gj-wes
  • 912
  • 5
  • 9
  • Thank you. This is probably a more sound and permanent solution than the using style="Margin: 0!important; Padding: 0!important;" – jojo Jun 27 '16 at 19:32
  • I agree: first choice is not to use `

    ` tags, but if you can't avoid it (eg. your importing markup that you can't alter) capitalizing the 'M' should scale just fine.

     – Ted Goas Jun 27 '16 at 19:36
0

Just override them by adding margin: 0; to <p> You can probably add !important to the margin.

Cookie Ninja
  • 1,156
  • 15
  • 29
  • That doesn't work. Outlook strips out margin and then adds: p { display: block; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; } – jojo Jun 25 '16 at 04:23
  • Did you try these: `

    `? Adding a style that will override the `margin`?     – Cookie Ninja Jun 25 '16 at 04:38
  • Yes. I tried:

    – jojo Jun 25 '16 at 05:22
  • @ynot Can you post your full code so I can look up to it? – Cookie Ninja Jun 25 '16 at 06:09
  • 1
    You want the `margin` stuff to be 0 right? I quite find the issue here that gives a gap between `

    ` 's. Try removing the `
    ` between them and you can get your desired output.

     – Cookie Ninja Jun 25 '16 at 11:08
  • Like I said in the beginning, outlook.com ads p { display: block; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; }. I'm not trying to remove the space, the problem is that there's too much space when you view it on outlook. – jojo Jun 25 '16 at 11:15
  • Of course there is too much space, when you put BR elements between the paragraphs ... what are those doing there in the first place? Per default paragraphs have spacing between them already (via the default margins), so what are those BR _doing_ there? – CBroe Jun 25 '16 at 13:03
  • @CBroe I'm trying to find a method where I don't have to be at the mercy of styles forced on me by mail clients. This is why I first set all margins and padding to 0 and then use the br for spacing because br is uniform across clients. – jojo Jun 25 '16 at 19:05