layout/reftests/bugs/368504-4.html

   1 <html>
   2 <head><style>
   3   /* cellspacing=0 cellpadding=0          */
   4   table  { border-spacing: 0 }
   5   td, th { padding: 0 }
   6
   7   /* Colors for the three cell types      */
   8   td.a   { background: lightgreen; }
   9   td.b   { background: yellow;     }
  10   td.c   { background: blue;       }
  11
  12   /* Shrink-wrapping div                  */
  13   div.shrinkwrap { width: 1px;   }
  14
  15   /* Set min-width on colspanning cell    */
  16   td.c { min-width: 500px; }
  17
  18   /* Set %-width on 2nd cell of first row in tables */
  19   table#t0 td.b { width:   1% }
  20   table#t1 td.b { width:   5% }
  21   table#t2 td.b { width:  10% }
  22   table#t3 td.b { width:  30% }
  23   table#t4 td.b { width:  50% }
  24   table#t5 td.b { width:  75% }
  25   table#t6 td.b { width:  80% }
  26   table#t7 td.b { width:  90% }
  27   table#t8 td.b { width:  95% }
  28   table#t9 td.b { width: 100% }
  29
  30 </style></head>
  31 <body>
  32 <div class="shrinkwrap">
  33 <table id="t0"><tr>
  34     <td class="a">foo</td>
  35     <td class="b">foo</td>
  36   </tr><tr>
  37     <td class="c" colspan="2">&nbsp</td>
  38 </tr></table>
  39 </div>
  40
  41 <div class="shrinkwrap">
  42 <table id="t1"><tr>
  43     <td class="a">foo</td>
  44     <td class="b">foo</td>
  45   </tr><tr>
  46     <td class="c" colspan="2">&nbsp</td>
  47 </tr></table>
  48 </div>
  49
  50 <div class="shrinkwrap">
  51 <table id="t2"><tr>
  52     <td class="a">foo</td>
  53     <td class="b">foo</td>
  54   </tr><tr>
  55     <td class="c" colspan="2">&nbsp</td>
  56 </tr></table>
  57 </div>
  58
  59 <div class="shrinkwrap">
  60 <table id="t3"><tr>
  61     <td class="a">foo</td>
  62     <td class="b">foo</td>
  63   </tr><tr>
  64     <td class="c" colspan="2">&nbsp</td>
  65 </tr></table>
  66 </div>
  67
  68 <div class="shrinkwrap">
  69 <table id="t4"><tr>
  70     <td class="a">foo</td>
  71     <td class="b">foo</td>
  72   </tr><tr>
  73     <td class="c" colspan="2">&nbsp</td>
  74 </tr></table>
  75 </div>
  76
  77 <div class="shrinkwrap">
  78 <table id="t5"><tr>
  79     <td class="a">foo</td>
  80     <td class="b">foo</td>
  81   </tr><tr>
  82     <td class="c" colspan="2">&nbsp</td>
  83 </tr></table>
  84 </div>
  85
  86 <div class="shrinkwrap">
  87 <table id="t6"><tr>
  88     <td class="a">foo</td>
  89     <td class="b">foo</td>
  90   </tr><tr>
  91     <td class="c" colspan="2">&nbsp</td>
  92 </tr></table>
  93 </div>
  94
  95 <div class="shrinkwrap">
  96 <table id="t7"><tr>
  97     <td class="a">foo</td>
  98     <td class="b">foo</td>
  99   </tr><tr>
 100     <td class="c" colspan="2">&nbsp</td>
 101 </tr></table>
 102 </div>
 103
 104 <div class="shrinkwrap">
 105 <table id="t8"><tr>
 106     <td class="a">foo</td>
 107     <td class="b">foo</td>
 108   </tr><tr>
 109     <td class="c" colspan="2">&nbsp</td>
 110 </tr></table>
 111 </div>
 112
 113 <div class="shrinkwrap">
 114 <table id="t9"><tr>
 115     <td class="a">foo</td>
 116     <td class="b">foo</td>
 117   </tr><tr>
 118     <td class="c" colspan="2">&nbsp</td>
 119 </tr></table>
 120 </div>
 121 </body>
 122 </html>