computing-table-width-0.html (1486B)
1 <!doctype html> 2 <script src='/resources/testharness.js'></script> 3 <script src='/resources/testharnessreport.js'></script> 4 <link rel='stylesheet' href='../support/base.css' /> 5 6 <link rel="author" title="Greg Whitworth" href="gwhit@microsoft.com" /> 7 <link rel="help" href="https://drafts.csswg.org/css-tables-3/#computing-the-table-width" /> 8 <main> 9 <h1>Width Distribution</h1> 10 <h4>"Computing the table width"</h4> 11 <p>This is testing that the table root's minimum is max(table-root width, capmin, gridmin) <a href="https://drafts.csswg.org/css-tables-3/#computing-the-table-width">Spec Text</a></p> 12 13 <hr/> 14 <x-table id="one" style="width: 50px; height: 100px; border: 2px solid black;"> 15 <x-caption><span style="display: inline-block; height: 100px; width: 100px; background: blue;"></x-caption> 16 <x-tr> 17 <x-td></x-td> 18 </x-tr> 19 </x-table> 20 </main> 21 22 <script> 23 while(true) { 24 var xtd = document.querySelector('x-td[rowspan], x-td[colspan]'); if(!xtd) break; 25 var td = document.createElement('td'); for(var i = xtd.attributes.length; i--;) { td.setAttribute(xtd.attributes[i].name,xtd.attributes[i].value) } 26 xtd.parentNode.replaceChild(td,xtd); 27 } 28 29 var i = 1; 30 generate_tests(assert_equals, [ 31 [ 32 // TEST ONE 33 "Width is 100px due to 100px content size of caption", 34 document.getElementById('one').offsetWidth, 35 100 36 ] 37 ]); 38 </script> 39 </html>