replaced-element-036.html (864B)
1 <!DOCTYPE html> 2 <title>CSS aspect-ratio: img</title> 3 <link rel="author" title="Jake Archibald" href="jakearchibald@google.com" /> 4 <link rel="help" href="https://drafts.csswg.org/css-sizing-4/#aspect-ratio" /> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <style> 8 img { 9 width: 100px; 10 aspect-ratio: 1/2; 11 background: green; 12 } 13 </style> 14 <div id="log"></div> 15 16 <img 17 src="error.png" 18 style="display: block" 19 alt="display:block img should be 200px high" 20 /> 21 22 <img 23 src="error.png" 24 style="display: inline-block" 25 alt="display:inline-block img should be 200px high" 26 /> 27 28 <script> 29 setup({ explicit_done: true }); 30 31 onload = () => { 32 for (const img of document.images) { 33 test(() => { 34 assert_equals(img.offsetHeight, 200); 35 }, img.alt); 36 } 37 38 done(); 39 }; 40 </script>