homepage Welcome to WebmasterWorld Guest from 54.196.201.253
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
mailer help - images display in wrong positions
img embedded but showing at bottom of e-mail only
jason_m




msg:4167684
 1:48 pm on Jul 10, 2010 (gmt 0)

hello,
i am using the following code
<table style="width:500px;" >
<tr>
<td colspan="4" ></td>
</tr>

<tr>
<td>
<img style="float: center;position: absolute;padding-left: 10px;padding-right: 0px;top:135px;z-index: 0;" src="bk1 - front - mailer.jpg">
</td>
<td>
<img style="float: center;position: absolute;padding-left: 7px;padding-right: 0px;top:135px;z-index: 0;" src="bk2 - front - mailer.jpg">
</td>
<td>
<img style="float: center;position: absolute;padding-left: 7px;padding-right: 0px;top:135px;z-index: 0;" src="bk3 - front - mailer.jpg">
</td>
<td>
<img style="float: center;position: absolute;padding-left: 2px;padding-right: 0px;top:135px;z-index: 0;" src="bk4 - front - mailer.jpg">
</td>
</tr>
<tr>
<td colspan="4"><div style="float:left;position: absolute;width: 500px;top: 70px;z-index: 1;font-family: times, serif;font-size: 45px;text-align: center;">
newsletter
</div>
</td>
<tr>
<td colspan="4">
<div style="float:left;position: absolute;top: 240px;font-family: monospace, serif;font-size: 13px;font-weight: normal;color: brown;">
<div style="position: relative;margin-top: 0px;font-family: monospace, serif;font-size: 13px;font-weight: normal;color: brown;text-align: center;">
here is my quote!
</div>
<br>
<hr style="border:dashed brown;border-width:1px 0 0;height:0;width: 500px;">
<div style="font-family: times, serif;font-size: 22px;color: black;">
This is the title of my post1!
</div>
<br>
description A!
<br>
<a style="color: cyan;font-size: 13px;" href="#">
read more
</a>
<hr style="border:dashed brown;border-width:1px 0 0;height:0;width: 500px;">
<div style="font-family: times, serif;font-size: 22px;color: black;">
This is the title of my post2!
</div>
<br>
description B!
<br>
<a style="color: cyan;font-size: 13px;" href="#">
read more
</a>
</div>
</td>
</tr>
</table>


the images should appear embedded in the table, but they are only appearing at the bottom of the e-mail. i am obviously doing something wrong and any help would be great

thanks!

 

tedster




msg:4167837
 8:54 pm on Jul 10, 2010 (gmt 0)

I'm very suspicious of using any CSS positioning in an email - most email clients are severely limited in this area. Absolute and relative positions are usually not the way to go. Even though they may be fine for a full blow browser rendering, in a mailer only a limited subset of CSS and HTML is available.

Try these two threads for ideas:

The Challenges of HTML Email [webmasterworld.com]
Outlook 2007 now using MS Word rendering engine [webmasterworld.com]

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved