third_party/WebKit/LayoutTests/fast/table/resize-table-width-using-col-colgroup-span.html

   1 <!DOCTYPE html>
   2 <style>
   3     #thecol { width: 200px; }
   4     td { height: 25px; }
   5 </style>
   6 <script type="text/javascript">
   7     onload = function () {
   8         var col = document.getElementById('thecol');
   9         var output = document.getElementById('test-output');
  10         col.offsetTop;
  11         col.style.width="100px";
  12         checkLayout("#td1", output);
  13         checkLayout("#td2", output);
  14         checkLayout("#td3", output);
  15         checkLayout("#td4", output);
  16         checkLayout("#td5", output);
  17         checkLayout("#td6", output);
  18         checkLayout("#td7", output);
  19         checkLayout("#td8", output);
  20         checkLayout("#td9", output);
  21     }
  22 </script>
  23 <script src="../../resources/check-layout.js"></script>
  24 Tests that the width of table cell changes on changing the colgroup width to new width.
  25 <table>
  26     <colgroup id="thecol" span="4" style="background-color:red"/>
  27     </col>
  28     <thead>
  29         <tr>
  30             <td id="td1" data-expected-width="100"></td>
  31             <td id="td2" data-expected-width="100"></td>
  32             <td id="td3" data-expected-width="100"></td>
  33         </tr>
  34     </thead>
  35     <tfoot>
  36         <tr>
  37             <td id="td4" data-expected-width="100"></td>
  38             <td id="td5" data-expected-width="100"></td>
  39             <td id="td6" data-expected-width="100"></td>
  40         </tr>
  41     </tfoot>
  42     <tbody>
  43         <tr>
  44             <td id="td7" data-expected-width="100"></td>
  45             <td id="td8" data-expected-width="100"></td>
  46             <td id="td9" data-expected-width="100"></td>
  47         </tr>
  48     </tbody>
  49 </table>
  50 <div id="test-output"></div>