Wed, 31 Dec 2014 07:16:47 +0100
Revert simplistic fix pending revisit of Mozilla integration attempt.
1 <!DOCTYPE html>
2 <html lang="en-US">
3 <head>
4 <title>test of box-sizing</title>
5 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
6 <meta http-equiv="Content-Style-Type" content="text/css">
7 <style type="text/css">
9 body { font-size: 10px; line-height: 1; }
10 table { border-spacing: 0; margin: 0; }
11 td { border: 1px solid; padding: 1px solid; }
13 td td > div {
14 margin-left: 1px;
15 border-left: 2px solid;
16 padding-left: 4px;
17 padding-right: 8px;
18 border-right: 16px solid;
19 margin-right: 32px;
21 background: yellow;
22 }
24 </style>
25 </head>
26 <body>
28 <table><tr>
30 <td id="bscontent">
32 <!-- box-sizing: content-box -->
33 <table><tr><td><div>A B</div></td></tr></table>
34 <table><tr><td><div>A B</div></td></tr></table>
35 <table><tr><td><div>A<br>B</div></td></tr></table>
36 <table><tr><td><div>A B</div></td></tr></table>
37 <table><tr><td><div>A B</div></td></tr></table>
38 <table><tr><td><div style="width: 150px">A B</div></td></tr></table>
40 </td>
42 <td id="bspadding">
43 <!-- box-sizing: padding-box -->
44 <table><tr><td><div>A B</div></td></tr></table>
45 <table><tr><td><div>A B</div></td></tr></table>
46 <table><tr><td><div>A<br>B</div></td></tr></table>
47 <table><tr><td><div>A B</div></td></tr></table>
48 <table><tr><td><div>A B</div></td></tr></table>
49 <table><tr><td><div style="width: 138px">A B</div></td></tr></table>
51 </td>
53 <td id="bsborder">
54 <!-- box-sizing: border-box -->
55 <table><tr><td><div>A B</div></td></tr></table>
56 <table><tr><td><div>A B</div></td></tr></table>
57 <table><tr><td><div>A<br>B</div></td></tr></table>
58 <table><tr><td><div>A B</div></td></tr></table>
59 <table><tr><td><div>A B</div></td></tr></table>
60 <table><tr><td><div style="width: 120px">A B</div></td></tr></table>
62 </td>
64 </tr></table>
66 </body>
67 </html>