2

I made an HTML email in Dreamweaver.

I have used a table to contain the body of the email.

I have added images, in rows. However in the browser the images leave a blank space in the middle. This only happens when I look at the email on Hotmail. Microsoft Outlook is fine. I don't understand why this is happening

![as you can see on the html email(hotmail) it shows like this, but in outlook there is no space!!!][1]

as you can see on the html email(hotmail) it shows like this, but in outlook there is no space!

html code:

          <td height="8" valign="top" colspan="2"><img src="images/greenTop01.gif" alt="top" width="595" height="8" valign="top" display:"block" ></td>
  </tr>
  <tr>
    <td width="453" height="115" valign="top" bgcolor="#18b581"><p style="font-family: Arial, Helvetica, sans-serif; color:#FFFFFF; display:block; margin-left: 25px;"><strong><font size="4">Could you have a patient with NP-C?</font>

ful html: http://jsfiddle.net/eNKxp/1/

al123
  • 561
  • 9
  • 25
  • `margin: "100px"` is invalid, also, you should set the height on the `td`, so ``, and also use `valign` to vertically align everything to the top. `` – Nick R Jan 09 '14 at 14:57
  • @al123 Can you put this code into jsFiddle please. – John Jan 09 '14 at 14:59
  • For best user experience, just make a screenshot of your email in dreamweaver, cut it down to the email only, and send that image only. This way you can circumvent any possible client compatibility issues. – Alexander Jan 09 '14 at 15:04
  • @Alexander It will be even more likely to be marked as spam, as the filter won't be able to read any text... – Nick R Jan 09 '14 at 15:08
  • full html : http://jsfiddle.net/eNKxp/1/ – al123 Jan 09 '14 at 15:29
  • @NickR have you had a look at the full html, i dont understand why in some browser it shows and others it doesnt – al123 Jan 09 '14 at 15:40
  • @al123 http://jsfiddle.net/eNKxp/2/ - I've updated your Fiddle, and added `style="display:block"` to all images, I did a quick find and replace, so might not be perfect. – Nick R Jan 09 '14 at 15:43
  • yeh, copied it to new html page, it still showing the white space on hotmail... – al123 Jan 09 '14 at 15:48
  • 1
    possible duplicate of [outlook not aligning 2 images but other browsers are](http://stackoverflow.com/questions/21025156/outlook-not-aligning-2-images-but-other-browsers-are) – John Jan 10 '14 at 15:06
  • Isn't this pretty much the same question as http://stackoverflow.com/questions/21025156/outlook-not-aligning-2-images-but-other-browsers-are ? You shouldn't repost questions, instead update your question if the scope changes as you work through the issue. – John Jan 10 '14 at 15:08

1 Answers1

2

you need to use display:block for the images. See this table to have an idea about html support for email templates: http://www.campaignmonitor.com/css/

n1kkou
  • 3,096
  • 2
  • 21
  • 32
  • @al123 `display:block` should be added to the style attribute ;-) – Nick R Jan 09 '14 at 15:10
  • `display:"block"` is not valid. Use `style="display:block"`. Also it's a good idea to use old `align` rule for the cells. Before using this sintax make sure you have a valid html4 doctype(as in html5 `align` rule for example is deprecated) – n1kkou Jan 09 '14 at 15:11
  • Can you post the full `HTML` document. – Nick R Jan 09 '14 at 15:16
  • `display: "block">`, you don't need `"` - remove the double quotes from block – Nick R Jan 09 '14 at 15:20