scroll-width-height.tentative.html (1264B)
1 <!DOCTYPE html> 2 <script src="/resources/testharness.js"></script> 3 <script src="/resources/testharnessreport.js"></script> 4 <script src="/resources/check-layout-th.js"></script> 5 <style> 6 .multi { 7 width: 400px; 8 height: 400px; 9 columns: 3; 10 } 11 .child { 12 inline-size: 100px; 13 block-size: 100px; 14 outline: solid black; 15 } 16 .grandchild { 17 inline-size: 100px; 18 block-size: 300px; 19 background: lime; 20 } 21 </style> 22 <body onload="checkLayout('.child, .grandchild')"> 23 <div id=log></div> 24 25 <div class="multi" style="writing-mode: horizontal-tb"> 26 <div class="child" data-expected-scroll-width="100" data-expected-scroll-height="300"> 27 <div class="grandchild" data-expected-scroll-width="100" data-expected-scroll-height="300"></div> 28 </div> 29 </div> 30 <div class="multi" style="writing-mode: vertical-rl"> 31 <div class="child" data-expected-scroll-width="300" data-expected-scroll-height="100"> 32 <div class="grandchild" data-expected-scroll-width="300" data-expected-scroll-height="100"></div> 33 </div> 34 </div> 35 <div class="multi" style="writing-mode: vertical-lr"> 36 <div class="child" data-expected-scroll-width="300" data-expected-scroll-height="100"> 37 <div class="grandchild" data-expected-scroll-width="300" data-expected-scroll-height="100"></div> 38 </div> 39 </div>