368504-5.html (2188B)
1 <html> 2 <head><style> 3 /* cellspacing=0 cellpadding=0 */ 4 table { border-spacing: 0 } 5 td, th { padding: 0 } 6 7 /* Colors for the three cell types */ 8 td.a { background: lightgreen; } 9 td.b { background: yellow; } 10 td.c { background: blue; } 11 12 /* Set min-width on colspanning cell */ 13 td.c { min-width: 200px; } 14 15 /* Set %-width on 2nd cell of first row in tables */ 16 table#t0 td.b { width: 1% } 17 table#t1 td.b { width: 5% } 18 table#t2 td.b { width: 10% } 19 table#t3 td.b { width: 30% } 20 table#t4 td.b { width: 50% } 21 table#t5 td.b { width: 75% } 22 table#t6 td.b { width: 80% } 23 table#t7 td.b { width: 90% } 24 table#t8 td.b { width: 95% } 25 table#t9 td.b { width: 100% } 26 27 </style></head> 28 <body> 29 <table id="t0"><tr> 30 <td class="a">foo</td> 31 <td class="b">foo</td> 32 </tr><tr> 33 <td class="c" colspan="2"> </td> 34 </tr></table> 35 36 <table id="t1"><tr> 37 <td class="a">foo</td> 38 <td class="b">foo</td> 39 </tr><tr> 40 <td class="c" colspan="2"> </td> 41 </tr></table> 42 43 <table id="t2"><tr> 44 <td class="a">foo</td> 45 <td class="b">foo</td> 46 </tr><tr> 47 <td class="c" colspan="2"> </td> 48 </tr></table> 49 50 <table id="t3"><tr> 51 <td class="a">foo</td> 52 <td class="b">foo</td> 53 </tr><tr> 54 <td class="c" colspan="2"> </td> 55 </tr></table> 56 57 <table id="t4"><tr> 58 <td class="a">foo</td> 59 <td class="b">foo</td> 60 </tr><tr> 61 <td class="c" colspan="2"> </td> 62 </tr></table> 63 64 <table id="t5"><tr> 65 <td class="a">foo</td> 66 <td class="b">foo</td> 67 </tr><tr> 68 <td class="c" colspan="2"> </td> 69 </tr></table> 70 71 <table id="t6"><tr> 72 <td class="a">foo</td> 73 <td class="b">foo</td> 74 </tr><tr> 75 <td class="c" colspan="2"> </td> 76 </tr></table> 77 78 <table id="t7"><tr> 79 <td class="a">foo</td> 80 <td class="b">foo</td> 81 </tr><tr> 82 <td class="c" colspan="2"> </td> 83 </tr></table> 84 85 <table id="t8"><tr> 86 <td class="a">foo</td> 87 <td class="b">foo</td> 88 </tr><tr> 89 <td class="c" colspan="2"> </td> 90 </tr></table> 91 92 <table id="t9"><tr> 93 <td class="a">foo</td> 94 <td class="b">foo</td> 95 </tr><tr> 96 <td class="c" colspan="2"> </td> 97 </tr></table> 98 </body> 99 </html>