445142-1a.html (2384B)
1 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 2 "http://www.w3.org/TR/html4/strict.dtd"> 3 <html lang="en-US"> 4 <head> 5 <title>table-layout: fixed width distribution with unassigned space</title> 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 7 <meta http-equiv="Content-Style-Type" content="text/css"> 8 <style type="text/css"> 9 10 table, td { margin: 0; padding: 0; } 11 12 table { 13 table-layout: fixed; 14 width: 600px; 15 border-spacing: 0; 16 margin-bottom: 2px; 17 } 18 19 td { color: black; background: yellow; } 20 td + td { background: aqua; } 21 td + td + td { background: fuchsia; } 22 23 </style> 24 </head> 25 <body> 26 27 <table> 28 <tr> 29 <td style="width: 100px">100px</td> 30 </tr> 31 </table> 32 33 <table> 34 <tr> 35 <td style="width: 700px">700px</td> 36 </tr> 37 </table> 38 39 <table> 40 <tr> 41 <td style="width: 600px">600px</td> 42 </tr> 43 </table> 44 45 <table> 46 <tr> 47 <td style="width: 100px">100px</td> 48 <td style="width: 200px">200px</td> 49 </tr> 50 </table> 51 52 <table> 53 <tr> 54 <td style="width: 150px">150px</td> 55 <td style="width: 300px">300px</td> 56 </tr> 57 </table> 58 59 <table> 60 <tr> 61 <td style="width: 20%">20%</td> 62 </tr> 63 </table> 64 65 <table> 66 <tr> 67 <td style="width: 100%">100%</td> 68 </tr> 69 </table> 70 71 <table> 72 <tr> 73 <td style="width: 120%">120%</td> 74 </tr> 75 </table> 76 77 <table> 78 <tr> 79 <td style="width: 20%">20%</td> 80 <td style="width: 40%">40%</td> 81 </tr> 82 </table> 83 84 <table> 85 <tr> 86 <td style="width: 30%">30%</td> 87 <td style="width: 60%">60%</td> 88 </tr> 89 </table> 90 91 <table> 92 <tr> 93 <td style="width: 20%">20%</td> 94 <td style="width: 100px">100px</td> 95 </tr> 96 </table> 97 98 <table> 99 <tr> 100 <td style="width: 20%">20%</td> 101 <td style="width: 100px">100px</td> 102 <td><div style="width: 100px">div</div></td> 103 </tr> 104 </table> 105 106 <table> 107 <tr> 108 <td style="width: 20%">20%</td> 109 <td style="width: 0">0</td> 110 </tr> 111 </table> 112 113 <table> 114 <tr> 115 <td style="width: 20%">20%</td> 116 <td style="width: 0%">0%</td> 117 </tr> 118 </table> 119 120 <table> 121 <tr> 122 <td style="width: 100px">100px</td> 123 <td style="width: 0">0</td> 124 </tr> 125 </table> 126 127 <table> 128 <tr> 129 <td style="width: 100px">100px</td> 130 <td style="width: 0%">0%</td> 131 </tr> 132 </table> 133 134 <table> 135 <tr> 136 <td style="width: 0">0</td> 137 <td style="width: 0">0</td> 138 </tr> 139 </table> 140 141 <table> 142 <tr> 143 <td style="width: 0%">0%</td> 144 <td style="width: 0">0</td> 145 </tr> 146 </table> 147 148 </body> 149 </html>