445142-1-ref.html (2479B)
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 border-spacing: 0; 14 margin-bottom: 2px; 15 } 16 17 td { color: black; background: yellow; } 18 td + td { background: aqua; } 19 td + td + td { background: fuchsia; } 20 21 </style> 22 </head> 23 <body> 24 25 <table> 26 <tr> 27 <td style="width: 600px">100px</td> 28 </tr> 29 </table> 30 31 <table> 32 <tr> 33 <td style="width: 700px">700px</td> 34 </tr> 35 </table> 36 37 <table> 38 <tr> 39 <td style="width: 600px">600px</td> 40 </tr> 41 </table> 42 43 <table> 44 <tr> 45 <td style="width: 200px">100px</td> 46 <td style="width: 400px">200px</td> 47 </tr> 48 </table> 49 50 <table> 51 <tr> 52 <td style="width: 200px">150px</td> 53 <td style="width: 400px">300px</td> 54 </tr> 55 </table> 56 57 <table> 58 <tr> 59 <td style="width: 600px">20%</td> 60 </tr> 61 </table> 62 63 <table> 64 <tr> 65 <td style="width: 600px">100%</td> 66 </tr> 67 </table> 68 69 <table> 70 <tr> 71 <td style="width: 600px">120%</td> 72 </tr> 73 </table> 74 75 <table> 76 <tr> 77 <td style="width: 200px">20%</td> 78 <td style="width: 400px">40%</td> 79 </tr> 80 </table> 81 82 <table> 83 <tr> 84 <td style="width: 200px">30%</td> 85 <td style="width: 400px">60%</td> 86 </tr> 87 </table> 88 89 <table> 90 <tr> 91 <td style="width: 120px">20%</td> 92 <td style="width: 480px">100px</td> 93 </tr> 94 </table> 95 96 <table> 97 <tr> 98 <td style="width: 120px">20%</td> 99 <td style="width: 100px">100px</td> 100 <td style="width: 380px">div</td> 101 </tr> 102 </table> 103 104 <table> 105 <tr> 106 <td style="width: 600px">20%</td> 107 <td style="width: 0"><div style="width: 0">0</div></td> 108 </tr> 109 </table> 110 111 <table> 112 <tr> 113 <td style="width: 600px">20%</td> 114 <td style="width: 0"><div style="width: 0">0%</div></td> 115 </tr> 116 </table> 117 118 <table> 119 <tr> 120 <td style="width: 600px">100px</td> 121 <td style="width: 0"><div style="width: 0">0</div></td> 122 </tr> 123 </table> 124 125 <table> 126 <tr> 127 <td style="width: 600px">100px</td> 128 <td style="width: 0"><div style="width: 0">0%</div></td> 129 </tr> 130 </table> 131 132 <table> 133 <tr> 134 <td style="width: 300px">0</td> 135 <td style="width: 300px">0</td> 136 </tr> 137 </table> 138 139 <table> 140 <tr> 141 <td style="width: 300px">0%</td> 142 <td style="width: 300px">0</td> 143 </tr> 144 </table> 145 146 </body> 147 </html>