Outlook and HTML format emails. Table bug.

Hello.

This question is regarding construction HTML in emails.

I have the following HTML:

<html>
      <head>
      </head>
      <body leftMargin="0" topMargin="0" rightMargin="0">
            <div style="LEFT: 0px; POSITION: absolute; TOP: 0px">
                  <table style="FONT-SIZE: 12px; FONT-FAMILY: arial" cellSpacing="0" cellPadding="0" width="600" border="0">
                        <tr>
                              <td>
                                    <table id="Table3" cellSpacing="0" cellPadding="0" width="600" border="0">
                                          <tr>
                                                <td vAlign="top" align="left"><img src="http://urbanpanic.com/images/top.gif" border="0"></td>
                                                <td vAlign="top" align="right">img</td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>
                        <tr>
                              <td vAlign="top">
                                    <table id="Table2" style="FONT-SIZE: 12px; FONT-FAMILY: arial" cellSpacing="0" cellPadding="0" width="600">
                                          <tr>
                                                <td vAlign="top" align="left" width="40"><img src="http://urbanpanic.com/images/bottom.gif"></td>
                                                <td width="108">&nbsp;</td>
                                                <td><FONT color="#dcdcdc" size="5"></FONT>
                                                      <H4><FONT color="#dcdcdc" size="5">Title</FONT></H4>
                                                      <H4><FONT size="2">ddsdkhj sdfsdifj sdi;f si;d;adf asdi;fgjdi;f gddg 'dsfojkodfg </FONT>
                                                      </H4>
                                                      <H4><FONT size="2">dsf gopksdfgopk sdf#ogk dfpgk sdopfgk</FONT></H4>
                                                      <H4><FONT size="2">df gksdfpgk sdfpgkdpsfg</FONT></H4>
                                                      <H4><FONT size="2">dfgk dfp</FONT></H4>
                                                      <H4><FONT size="2">gk dfpgk</FONT></H4>
                                                      <H4><FONT size="2">&nbsp;dfgk</FONT></H4>
                                                      <H4><FONT size="2">&nbsp;
                                                                  <BR>
                                                      </H4>
                                                      </FONT>
                                                </td>
                                          </tr>
                                    </table>
                              </td>
                        </tr>
                        <tr>
                              <td>
                              </td>
                        </tr>
                  </table>
            </div>
      </body>
</html>

------------------------------------------------------------------------------------------------------------------

If you save the code into a HTML file, you will notice that the images are flush against each other. When you copy the contents of the page and paste into an outlook email, below the first image.. a gap appears?!!?!?

Why does this happen, and is there any way around? I've noticed this when I use tables within tables.. is there any work around ?

Thanks
LVL 1
bLUEAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

rubiconxCommented:
This is just one of those MS Quirks.  Provided you don't use MS Office to edit your email, then the gap you see whilst editing will not be seen by the recipient.  It often frustrates me that HTML viewed by Outlook, Word, Frontpage, IE can all look slightly different when they're all provided by the same company.  

The only way to check these things is to send a test to yourself.  You can view the message in the sent items or the inbox.  What you see there 'should' be what the recipient sees.

I presume you are actually saving the above as a stationary template!?!

Regards,

Dave
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
bLUEAuthor Commented:
Yes.. I wanted to make some templates that users could use. The only other way around this is to use a background image of the table. Problems like these are highly annoying

0
rubiconxCommented:
You just need to educate the user.  I have created dozens of templates for many companies, and provided the user understands the problem I've never had any trouble.

The other choice is to use HTML tags that don't have these quirks, but that leaves you with some very boring designs.

Regards,

Dave
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

rubiconxCommented:
Oh, and you can't use table backgrounds because they don't work is many of the other browsers - including Outlook 2003 if I recall correctly!
0
bLUEAuthor Commented:
What I was going to do was.. create the template.. and get the user to update the HTML using something WYSIWYG html editor and then paste into outlook. But that will still give the weird little error.. and now it seems like I cant use background images.. ! hheh

How are you going about this then ?
0
rubiconxCommented:
I avoid all HTML tags that don't work!

I need to clarify the table backgrounds.  You can use background colours but not background images!

I create a template with the word 'START' in the main body.  The user is then instructed to double-click the start to write their message.  If there are any 'quirks' I let them know and tell them to ignore them.  As long as they know it won't be seen by the recipient they're happy.  It sounds daft but works very well.

Dave
0
bLUEAuthor Commented:
I just dont know how I can get around it. its important to have the layout i posted above with those images flush together.. need that layout.

Thanks for the help tho.. good to realise its not only me.. !
0
rubiconxCommented:
Well if you figure it out, post the solution here 'cause I've been trying for over a year now and haven't cracked it yet!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Outlook

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.