413286-2b.html (1796B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Spanning cell has nonzero pref & min width</title> 5 <style> 6 table { width: 500px; } 7 td { height: 2em; } 8 td.aqua { background: aqua } 9 td.lime { background: lime } 10 td.blue { background: blue } 11 td.pink { background: pink } 12 td.yellow { background: yellow } 13 14 td.aquaText { color: aqua } 15 td.lowPct { width: 10% } 16 td.medPct { width: 40% } 17 td.hiPct { width: 50% } 18 td.specWidth { width: 50px } 19 </style> 20 </head> 21 <body> 22 <h2>No third column</h2> 23 <table cellpadding="0" cellspacing="0"> 24 <tr> 25 <td colspan="2" class="aqua aquaText">text</td> 26 </tr><tr> 27 <td class="lime specWidth"></td> 28 <td class="blue"></td> 29 </tr> 30 </table> 31 32 <h2>Third column with low percent width</h2> 33 <table cellpadding="0" cellspacing="0"> 34 <tr> 35 <td colspan="2" class="aqua aquaText">text</td> 36 <td class="yellow lowPct"></td> 37 </tr><tr> 38 <td class="lime specWidth"></td> 39 <td class="blue"></td> 40 <td class="pink lowPct"></td> 41 </tr> 42 </table> 43 44 <h2>Third column with medium percent width</h2> 45 <table cellpadding="0" cellspacing="0"> 46 <tr> 47 <td colspan="2" class="aqua aquaText">text</td> 48 <td class="yellow medPct"></td> 49 </tr><tr> 50 <td class="lime specWidth"></td> 51 <td class="blue"></td> 52 <td class="pink medPct"></td> 53 </tr> 54 </table> 55 56 <h2>Third column with preferred width</h2> 57 <table cellpadding="0" cellspacing="0"> 58 <tr> 59 <td colspan="2" class="aqua aquaText">text</td> 60 <td class="yellow specWidth"></td> 61 </tr><tr> 62 <td class="lime specWidth"></td> 63 <td class="blue"></td> 64 <td class="pink specWidth"></td> 65 </tr> 66 </table> 67 </body> 68 </html>