block-in-inline-hittest-float-002.html (2033B)
1 <!DOCTYPE html> 2 <link rel="help" href="http://www.w3.org/TR/CSS21/visuren.html#anonymous-block-level"> 3 <link rel="help" href="https://drafts.csswg.org/cssom-view/#dom-document-elementfrompoint"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <style> 7 section { 8 display: flow-root; 9 } 10 .float { 11 float: left; 12 width: 200px; 13 height: 20px; 14 background: orange; 15 } 16 .normal { 17 height: 10px; 18 background: blue; 19 } 20 </style> 21 <body> 22 <section> 23 <a href="#"> 24 <div> 25 <div class="float"></div> 26 <div class="normal"></div> 27 </div> 28 </a> 29 </section> 30 <section title="with background"> 31 <a href="#" style="background: purple"> 32 <div> 33 <div class="float"></div> 34 <div class="normal"></div> 35 </div> 36 </a> 37 </section> 38 <section title="with padding"> 39 <a href="#" style="padding: 1px"> 40 <div> 41 <div class="float"></div> 42 <div class="normal"></div> 43 </div> 44 </a> 45 </section> 46 <section title="floats before block-in-inline"> 47 <div class="float"></div> 48 <div> 49 <a href="#"> 50 <div class="normal"></div> 51 </a> 52 </div> 53 </section> 54 <section title="floats before block-in-inline with background"> 55 <div class="float"></div> 56 <div> 57 <a href="#" style="background: purple"> 58 <div class="normal"></div> 59 </a> 60 </div> 61 </section> 62 <script> 63 document.body.offsetTop; 64 for (const section of document.getElementsByTagName('section')) { 65 test(() => { 66 const float_element = section.querySelector('.float'); 67 const float_bounds = float_element.getBoundingClientRect(); 68 const normal_element = section.querySelector('.normal'); 69 const normal_bounds = normal_element.getBoundingClientRect(); 70 const x = float_bounds.x + (float_bounds.width / 2); 71 const y = normal_bounds.y + (normal_bounds.height / 2); 72 const result = document.elementFromPoint(x, y); 73 assert_equals(result, float_element); 74 }, section.title); 75 } 76 </script> 77 </body>