445142-1b.html (2794B)
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 <!-- 28 29 A copy of 445142-1a.html where one of the widths is specified on a col 30 instead of a td. 31 32 --> 33 34 <table> 35 <col style="width: 100px"> 36 <tr> 37 <td>100px</td> 38 </tr> 39 </table> 40 41 <table> 42 <col style="width: 700px"> 43 <tr> 44 <td>700px</td> 45 </tr> 46 </table> 47 48 <table> 49 <col style="width: 600px"> 50 <tr> 51 <td>600px</td> 52 </tr> 53 </table> 54 55 <table> 56 <col> 57 <col style="width: 200px"> 58 <tr> 59 <td style="width: 100px">100px</td> 60 <td>200px</td> 61 </tr> 62 </table> 63 64 <table> 65 <col style="width: 150px"> 66 <col> 67 <tr> 68 <td style="width: 9999px">150px</td> 69 <td style="width: 300px">300px</td> 70 </tr> 71 </table> 72 73 <table> 74 <col style="width: 20%"> 75 <tr> 76 <td>20%</td> 77 </tr> 78 </table> 79 80 <table> 81 <col style="width: 100%"> 82 <tr> 83 <td>100%</td> 84 </tr> 85 </table> 86 87 <table> 88 <col style="width: 120%"> 89 <tr> 90 <td>120%</td> 91 </tr> 92 </table> 93 94 <table> 95 <col style="width: 20%"> 96 <col> 97 <tr> 98 <td>20%</td> 99 <td style="width: 40%">40%</td> 100 </tr> 101 </table> 102 103 <table> 104 <col> 105 <col style="width: 60%"> 106 <tr> 107 <td style="width: 30%">30%</td> 108 <td style="width: 9999px">60%</td> 109 </tr> 110 </table> 111 112 <table> 113 <col style="width: 20%"> 114 <col> 115 <tr> 116 <td>20%</td> 117 <td style="width: 100px">100px</td> 118 </tr> 119 </table> 120 121 <table> 122 <col> 123 <col style="width: 100px"> 124 <col> 125 <tr> 126 <td style="width: 20%">20%</td> 127 <td style="width: 5%">100px</td> 128 <td><div style="width: 100px">div</div></td> 129 </tr> 130 </table> 131 132 <table> 133 <col style="width: 20%"> 134 <col> 135 <tr> 136 <td>20%</td> 137 <td style="width: 0">0</td> 138 </tr> 139 </table> 140 141 <table> 142 <col> 143 <col style="width: 0%"> 144 <tr> 145 <td style="width: 20%">20%</td> 146 <td>0%</td> 147 </tr> 148 </table> 149 150 <table> 151 <col> 152 <col style="width: 0"> 153 <tr> 154 <td style="width: 100px">100px</td> 155 <td>0</td> 156 </tr> 157 </table> 158 159 <table> 160 <col style="width: 100px"> 161 <col> 162 <tr> 163 <td>100px</td> 164 <td style="width: 0%">0%</td> 165 </tr> 166 </table> 167 168 <table> 169 <col style="width: 0"> 170 <col> 171 <tr> 172 <td>0</td> 173 <td style="width: 0">0</td> 174 </tr> 175 </table> 176 177 <table> 178 <col> 179 <col style="width: 0"> 180 <tr> 181 <td style="width: 0%">0%</td> 182 <td>0</td> 183 </tr> 184 </table> 185 186 </body> 187 </html>