413286-4b.html (1696B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>First two columns have no 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.lowPct { width: 10% } 15 td.medPct { width: 40% } 16 td.specWidth { width: 50px } 17 </style> 18 </head> 19 <body> 20 <h2>No third column</h2> 21 <table cellpadding="0" cellspacing="0"> 22 <tr> 23 <td class="aqua"></td> 24 <td class="aqua"></td> 25 </tr><tr> 26 <td class="lime"></td> 27 <td class="blue"></td> 28 </tr> 29 </table> 30 31 <h2>Third column with low percent width</h2> 32 <table cellpadding="0" cellspacing="0"> 33 <tr> 34 <td class="aqua"></td> 35 <td class="aqua"></td> 36 <td class="yellow lowPct"></td> 37 </tr><tr> 38 <td class="lime"></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 class="aqua"></td> 48 <td class="aqua"></td> 49 <td class="yellow medPct"></td> 50 </tr><tr> 51 <td class="lime"></td> 52 <td class="blue"></td> 53 <td class="pink medPct"></td> 54 </tr> 55 </table> 56 57 <h2>Third column with preferred width</h2> 58 <table cellpadding="0" cellspacing="0"> 59 <tr> 60 <td class="aqua"></td> 61 <td class="aqua"></td> 62 <td class="yellow specWidth"></td> 63 </tr><tr> 64 <td class="lime"></td> 65 <td class="blue"></td> 66 <td class="pink specWidth"></td> 67 </tr> 68 </table> 69 </body> 70 </html>