413286-4-ref.html (1779B)
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 </style> 14 </head> 15 <body> 16 <h2>No third column</h2> 17 <table cellpadding="0" cellspacing="0"> 18 <tr> 19 <td class="aqua"></td> 20 <td class="aqua"></td> 21 </tr><tr> 22 <td class="lime" style="width: 250px"></td> 23 <td class="blue" style="width: 250px"></td> 24 </tr> 25 </table> 26 27 <h2>Third column with low percent width</h2> 28 <table cellpadding="0" cellspacing="0"> 29 <tr> 30 <td class="aqua"></td> 31 <td class="aqua"></td> 32 <td class="yellow"></td> 33 </tr><tr> 34 <td class="lime" style="width: 225px"></td> 35 <td class="blue" style="width: 225px"></td> 36 <td class="pink" style="width: 50px"></td> 37 </tr> 38 </table> 39 40 <h2>Third column with medium percent width</h2> 41 <table cellpadding="0" cellspacing="0"> 42 <tr> 43 <td class="aqua"></td> 44 <td class="aqua"></td> 45 <td class="yellow"></td> 46 </tr><tr> 47 <td class="lime" style="width: 150px"></td> 48 <td class="blue" style="width: 150px"></td> 49 <td class="pink" style="width: 200px"></td> 50 </tr> 51 </table> 52 53 <h2>Third column with preferred width</h2> 54 <table cellpadding="0" cellspacing="0"> 55 <tr> 56 <td class="aqua"></td> 57 <td class="aqua"></td> 58 <td class="yellow"></td> 59 </tr><tr> 60 <td class="lime" style="width: 225px"></td> 61 <td class="blue" style="width: 225px"></td> 62 <td class="pink" style="width: 50px"></td> 63 </tr> 64 </table> 65 </body> 66 </html>