table-visual-layout-013

A spanning cell must be as far to the left as possible in an 'ltr' table

WeasyPrint

This browser

Assertion
The spanning cell's rectangle is as far to the left as possible, but to the right of all cells in the same row that were earlier in source (no overlapping).

Source

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
 2 <html>
 3     <head>
 4         <title>CSS Test: A spanning cell must be as far to the left as possible in an 'ltr' table</title>
 5         <link rel="author" title="Microsoft" href="http://www.microsoft.com/">
 6         <link rel="help" href="http://www.w3.org/TR/CSS21/tables.html#table-layout">
 7         <meta name="flags" content="">
 8         <meta name="assert" content="The spanning cell's rectangle is as far to the left as possible, but to the right of all cells in the same row that were earlier in source (no overlapping).">
 9         <style type="text/css">
10             td
11             {
12                 border: 1px solid black;
13                 height: 100px;
14                 width: 100px;
15             }
16             #cell
17             {
18                background: black;
19             }
20             .cell
21             {
22                 background: blue;
23             }
24         </style>
25     </head>
26     <body>
27         <p>Test passes if the black square is to the right of both blue boxes on the page.</p>
28         <table>
29             <tr>
30                 <td></td>
31                 <td class="cell" rowspan="2"></td>
32                 <td></td>
33                 <td></td>
34             </tr>
35             <tr>
36                 <td class="cell"></td>
37                 <td id="cell" rowspan="2" colspan="2"></td>
38             </tr>
39             <tr>
40                 <td></td>
41             </tr>
42             <tr>
43                 <td></td>
44             </tr>
45         </table>
46     </body>
47 </html>