Geek Answers Handbook

A link in a 100% width table results in a 90% width table

It is REALLY wierd.

This code below should contain an email 100% wide with the top color of lime. But since TD contains a link, the whole table now is 90% (or so), but only in the iPhone’s email. Delete the link and the letter is correct ... What is happening?

https://s3.amazonaws.com/resultcaptures/C1C356D4-EAC0-4A50-B278-04155E256E51.png

I threw my email back to this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Email</title> </head> <body bgcolor="brown" style="margin:0;padding:0; "> <table cellpadding="0" cellspacing="0" width="100%" bgcolor="black"> <tr> <td bgcolor="Lime"> <div><a href="#" alt="">This</a> is a link</div> </td> </tr> </table> </body> </html>

There is nothing wrong with that ... right? ... or am I blind?

0
source share
3 answers

This MacRumors thread provides a solution to the problem: http://forums.macrumors.com/showthread.php?t=1158457

Try setting align = "center" and style = "text-align: center" on the first table, and then place style = "text-align: left" on the second if necessary.

If you wrap your content in the parent table centered, this oddly seems to eliminate the correct margin on the iPhone iPhone reader.

+1
source

Of course, the problem is with iOS. The problem is that the email becomes smaller than the width of the mail client, but when the mail is narrower than the mail client, it accours - but only with email with anchors.

Set the table to 320px to get rid of it, but say goodbye to the elastic layout.

0
source

Ok, I found a working solution:

Just install:

 table { width: 99%; /* 99.99% doesn't seem to work */ margin: 0 auto; }

To get rid of a very small minimum gap, just set the background color the same as your table.

Fixed now!

I had the same problem: Link

0
source

More articles:


All Articles