scroll-marker-group-size-container-query.html (964B)
1 <!DOCTYPE html> 2 <title>CSS Overflow Test: Size container for ::scroll-marker-group</title> 3 <link rel="help" href="https://drafts.csswg.org/css-overflow-5/#scroll-marker-group-property"> 4 <link rel="help" href="https://drafts.csswg.org/css-conditional-5/#container-queries"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <style> 8 #container { 9 container-type: inline-size; 10 width: 400px; 11 } 12 #scroller { 13 container-type: inline-size; 14 overflow: auto; 15 width: 200px; 16 height: 200px; 17 scroll-marker-group: before; 18 @container (width = 400px) { 19 &::scroll-marker-group { --test: pass; } 20 } 21 } 22 </style> 23 <div id="container"> 24 <div id="scroller"></div> 25 </div> 26 <script> 27 test(() => { 28 assert_equals(getComputedStyle(scroller, "::scroll-marker-group").getPropertyValue("--test"), "pass"); 29 }, "::scroll-marker-group skips originating element for size queries"); 30 </script>