Wed, 31 Dec 2014 07:16:47 +0100
Revert simplistic fix pending revisit of Mozilla integration attempt.
1 <!DOCTYPE HTML>
2 <html>
3 <head>
4 <title>basis of percentage widths</title>
5 <style type="text/css">
7 td { border-width: 0; }
8 td div { border: 3px inset blue; padding: 3px; }
10 </style>
11 </head>
12 <body>
14 <!--
16 The difference between the border-box width of the table and the width allocated to the columns is:
18 2px = table border-left-width
19 9px = table padding-left
20 25px = 5 * table border-spacing-x
21 5px = table padding-right
22 2px = table border-left-width
23 =================================
24 43px
26 -->
28 <table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
29 <tr>
30 <td><div style="width: 38px">x</div></td>
31 <td><div style="width: 38px">x</div></td>
32 <td><div style="width: 38px">x</div></td>
33 <td><div style="width: 38px">x</div></td>
34 </tr>
35 </table>
37 <table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
38 <tr>
39 <td><div style="width: 38px">x</div></td>
40 <td><div style="width: 38px">x</div></td>
41 <td><div style="width: 38px">x</div></td>
42 <td><div style="width: 38px">x</div></td>
43 </tr>
44 </table>
46 <table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
47 <tr>
48 <td><div style="width: 88px">x</div></td>
49 <td><div style="width: 38px">x</div></td>
50 <td><div style="width: 113px">x</div></td>
51 <td><div style="width: 113px">x</div></td>
52 </tr>
53 </table>
55 <table cellpadding="0" cellspacing="5" border="2" style="padding: 3px 5px 7px 9px">
56 <tr>
57 <td><div style="width: 33px">x</div></td>
58 <td><div style="width: 23px">x</div></td>
59 <td><div style="width: 38px">x</div></td>
60 <td><div style="width: 38px">x</div></td>
61 </tr>
62 </table>
64 </body>
65 </html>