Welcome to WebmasterWorld Guest from 54.227.83.19

Forum Moderators: incrediBILL

Message Too Old, No Replies

mailer help - images display in wrong positions

img embedded but showing at bottom of e-mail only

     

jason_m

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

5+ Year Member



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

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

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member



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]
 

Featured Threads

Hot Threads This Week

Hot Threads This Month