caption-writing-mode-002.html (940B)
1 <!DOCTYPE html> 2 <script src='/resources/testharness.js'></script> 3 <script src='/resources/testharnessreport.js'></script> 4 <link rel="author" title="David Grogan" href="dgrogan@chromium.org"> 5 <link rel="help" href="https://www.w3.org/TR/css-writing-modes-3/#orthogonal-flows"> 6 <style> 7 x-table { 8 display: table; 9 width: 300px; 10 height: 300px; 11 writing-mode: vertical-lr; 12 outline: 2px dashed blue; 13 } 14 x-caption { 15 display: table-caption; 16 height: 200px; 17 width: 200px; 18 writing-mode: horizontal-tb; 19 outline: 1px solid black; 20 } 21 </style> 22 23 <x-table> 24 <x-caption>caption</x-caption> 25 </x-table> 26 27 <script> 28 let body_height = document.querySelector("body").offsetHeight; 29 test(() => { 30 assert_greater_than(body_height, 0, "Vertical table with horizontal caption doesn't make <body> have crazy height."); 31 assert_less_than(body_height, 10000, "Vertical table with horizontal caption doesn't make <body> have crazy height."); 32 }) 33 </script>