html - Unintentional Padding in Text Elements -
i'm using tables per client's request design. (read: no other option)
all table cells seem applying sort of vertical padding , screwing spacing. i've changed text/background color of 1 of cells on fiddle show mean. have tried setting margin , padding 0 on applicable elements.
thanks help!
<table width="346" border="0" cellpadding="0" cellspacing="0"> <tr height="66"> <td width="85" style="padding:0;" align="left" valign="top"> <span style="font-size:66px;font-weight:bold;line-height:50ox;">50</span> </td> <td width="50" align="left" valign="middle"> <table border="0" cellpadding="0" cellspacing="0"> <tr height="30"> <td width="50" align="center" valign="bottom"> <span style="font-size:28px;font-weight:bold;">%</span> </td> </tr> <tr height="20"> <td width="50" align="center" valign="bottom"> <span style="font-size:28px;font-weight:bold;">off</span> </td> </tr> </table> </td> <td width="211"></td> </tr> </table>
jsfiddle: http://jsfiddle.net/emtxu/
(note i'm looking @ vertical padding, not right side result of cell size)
i assuming reason using inline styles because doing email. try removing tr
heights on child elements , set line height both span
s. here updated fiddle: http://jsfiddle.net/emtxu/2/
Comments
Post a Comment