text-anchor-in-vertical-rl.html (1268B)
1 <!DOCTYPE html> 2 <link rel="author" title="Morten Stenshorne" href="mstensho@chromium.org"> 3 <link rel="help" href="https://drafts.csswg.org/css-scroll-anchoring/"> 4 5 <p>There should be no red below.</p> 6 <div id="container" style="writing-mode:vertical-rl; overflow:auto; width:300px; height:300px;"> 7 <div style="width:300px; background:red;"></div> 8 <div style="width:400px; font-size:16px; line-height:25px;"> 9 <span id="displayMe" style="color:red; display:none;"> 10 FAIL<br>FAIL<br>FAIL<br>FAIL<br> 11 </span> 12 line<br> 13 </div> 14 <div id="displayMeToo" style="display:none; width:300px; background:red;"></div> 15 </div> 16 17 <script src="/resources/testharness.js"></script> 18 <script src="/resources/testharnessreport.js"></script> 19 <script> 20 test(()=> { 21 var container = document.getElementById("container"); 22 var displayMe = document.getElementById("displayMe"); 23 var displayMeToo = document.getElementById("displayMeToo"); 24 // Scroll the text container into view. 25 container.scrollLeft = -300; 26 displayMe.style.display = "inline"; 27 displayMeToo.style.display = "block"; 28 assert_equals(container.scrollLeft, -400); 29 }, "Line at edge of scrollport shouldn't jump visually when content is inserted before"); 30 </script>