vendredi 2 janvier 2015

Yahoo webmail on mobile removes spaces between text buttons

Yahoo on iPhone 4s Safari removes the spacing between text navigation buttons. Every email client tested has rendered the spaces correctly except for Yahoo in mobile Safari. This is the HTML:





<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://ift.tt/kkyg93">
<html xmlns="http://ift.tt/lH0Osb">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>ZZZZZZZZZ | XXXXXXXXX&hellip; </title>
<style type="text/css">
.ReadMsgBody{width: 100%;}
.ExternalClass{width: 100%;}
body{-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
table {border-collapse: collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;}
</style>

</head>
<body><img src="http://ift.tt/1EWw6nk" width=1 height=1 width="1" height="1" border="0"><table bgcolor="#ffffff" border="0" align="center" cellpadding="0" cellspacing="0" width="100%">
<tr><td width="650"><table width="650" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#ffffff">
<tr><td>
<table width="650" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td width="325" align="left" valign="bottom"><a href="http://ift.tt/1I5UP4U" style="font-family: Arial, Helvetica, sans-serif;font-size:12px;color:#040400;text-decoration:underline;line-height:20px;">XXXXXXXXXX&hellip; </a></td><td width="325" align="right" valign="bottom"><a href="http://ift.tt/1EWw6nm" style="color: #000000;font-family: arial; font-size: 10px; text-decoration: underline;">View in web browser</a></td></tr>
</table>
</td></tr>
<tr><td id="header" align="center" width="650"><table id="header" width="650" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="650" style="padding-top:30px;">
<table width="650" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="535" align="left"><a href="http://ift.tt/1I5UPSj" width="535"><img border="0" style="display:block;color:#EC008C;font-family:Arial, Helvetica, sans-serif;" src="../../images/content/dai/temp/438/MS_header_01.gif" width="535" height="75" alt="ZZZZZZZZZ" /></a>
</td>
<td width="115">
<img border="0" style="display:block;" height="75" width="115" src="../../images/content/dai/temp/438/spacer.gif" alt="ZZZZZZZZZ" /></td>
</tr>
</table>
</td>
</tr>
<tr>
<td width="650">
<table border="0" cellspacing="0" cellpadding="55" align="center">
<tr style="text-transform: uppercase; font-family: arial; font-size: 17px;">
<td align="center" height="35" style="padding-top:0;padding-bottom:0;padding-left:0;"><a href="http://ift.tt/1I5UPli" style="text-decoration: none; color: #000000;">Bestsellers</a></td>
<td align="center" height="35" style="padding-top:0;padding-bottom:0;padding-left:0;"><a href="http://ift.tt/1EWw6DE" style="text-decoration: none; color: #000000;">Tops</a>
</td>
<td align="center" height="35" style="padding-top:0;padding-bottom:0;padding-left:0;"><a href="http://ift.tt/1I5UPSr" style="text-decoration: none; color: #000000;">Bottoms</a>
</td>
<td align="center" height="35" style="padding-top:0;padding-bottom:0;padding-left:0;"><a href="http://ift.tt/1EWw6DG" style="text-decoration: none; color: #000000;">Sale</a>
</td>
<td align="center" height="35" style="padding:0;"><a href="http://ift.tt/1I5UQ8K" style="text-decoration: none; color: #000000;">More</a>
</td>
</tr>
</table>
</td>
</tr>
</table></td></tr>



And a screenshot:


enter image description here


Any help is greatly appreciated!




Aucun commentaire:

Enregistrer un commentaire