<html> <!-- This testcase asserts that in all the tables below, all 500px of the -- -- orange colspanning cell's specified width should go to its first -- -- spanned column. Its second spanned column receives none of the -- -- 500px, and it only gets a small amount of width by taking half of the -- -- light-blue cell's preferred width. -- -- -- -- This happens because the first column starts with nonzero pref-width, -- -- whereas the second and third columns have zero pref-width. Hence, -- -- the orange colspanning cell favors the first column over the second, -- -- whereas the lightblue colspanning cell distributes its width equally -- -- between the second and third columns. --> <head><style> tr { height: 1em; } td.wide { width: 500px; } td.orange { background: orange; } td.purple { background: purple; } td.teal { background: teal; } td.blue { background: lightblue; } </style></head> <body> <p>(x,x) labels indicate the column & row order of the orange cell.</p> <br/>(0,0) <table cellpadding="0" cellspacing="0"> <tr> <td class="orange wide" colspan="2"></td> <td class="purple"></td> </td> </tr><tr> <td class="teal">x</td> <td class="blue" colspan="2">y z</td> </tr> </table> <br/>(0,1) <table cellpadding="0" cellspacing="0"> <tr> <td class="teal">x</td> <td class="blue" colspan="2">y z</td> </td> </tr><tr> <td class="orange wide" colspan="2"></td> <td class="purple"></td> </tr> </table> <br/>(1,0) <table cellpadding="0" cellspacing="0"> <tr> <td class="purple"></td> <td class="orange wide" colspan="2"></td> </td> </tr><tr> <td class="blue" colspan="2">y z</td> <td class="teal">x</td> </tr> </table> <br/>(1,1) <table cellpadding="0" cellspacing="0"> <tr> <td class="blue" colspan="2">y z</td> <td class="teal">x</td> </td> </tr><tr> <td class="purple"></td> <td class="orange wide" colspan="2"></td> </tr> </table> </body> </html>