visibility-collapse-row-005.html (1760B)
1 <!doctype html> 2 <meta charset="utf-8"> 3 <script src='/resources/testharness.js'></script> 4 <script src='/resources/testharnessreport.js'></script> 5 <link rel="author" title="Aleks Totic" href="mailto:atotic@chromium.org"> 6 <link rel="help" href="https://drafts.csswg.org/css-tables-3/#computing-the-table-height"> 7 <style> 8 main table { 9 border-spacing: 0; 10 } 11 main td { 12 width: 50px; 13 height: 50px; 14 background: gray; 15 padding: 0; 16 } 17 </style> 18 <main> 19 <h1>Visibility collapse and overflow</h1> 20 <p>Collapsed row should not contribute to overflow</p> 21 <div id="row" style="overflow-y: auto; width: 200px; height: 100px;border:1px solid black;"> 22 <table> 23 <tbody> 24 <tr> 25 <td></td> 26 <td></td> 27 </tr> 28 <tr> 29 <td></td> 30 <td></td> 31 </tr> 32 <tr style="visibility: collapse"> 33 <td></td> 34 <td></td> 35 </tr> 36 </tbody> 37 </table> 38 </div> 39 <p>Collapsed section should not contribute to overflow</p> 40 <div id="section" style="overflow-y: auto; width: 200px; height: 50px;border:1px solid black;"> 41 <table> 42 <thead> 43 <tr> 44 <td></td> 45 <td></td> 46 </tr> 47 </thead> 48 <tbody style="visibility:collapse"> 49 <tr> 50 <td></td> 51 <td></td> 52 </tr> 53 <tr> 54 <td></td> 55 <td></td> 56 </tr> 57 </tbody> 58 </table> 59 </div> 60 </main> 61 <script> 62 test( _ => { 63 assert_equals(document.querySelector("#row").scrollHeight, 100); 64 }, "collapsed row should not contribute to overflow"); 65 test( _ => { 66 assert_equals(document.querySelector("#section").scrollHeight, 50); 67 }, "collapsed section should not contribute to overflow"); 68 </script> 69 </html>