Wednesday, August 21, 2013

Setting width for TD including border and padding - IE8 Quirks mode

Setting width for TD including border and padding - IE8 Quirks mode

I have complex table with variable cell padding and borders. I want to set
fixed width for some cells, that will include the border and padding for
each one.
Unfortunately I target IE8 Quirks mode so I can't use box-sizing. I also
cannot use "table-layout: fixed", so answers in this direction will not
help.
I think that I can reduce the problem to this simple case, and maybe the
solution will help me in the general case:
<style>
td.td1 { width: 190px; border:10px; padding :10px; }
td.td2 { width: auto; }
</style>
<table style="width:100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td class="td1">cell 1</td>
<td class="td2">cell 2</td>
</tr>
</table>
td1 has width 210 instead of 190 as desired.

No comments:

Post a Comment