block-in-inline-become-float.html (691B)
1 <!DOCTYPE html> 2 <link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org"> 3 <link rel="help" href="http://crbug.com/332396356"> 4 <link rel="match" href="../../reference/ref-filled-green-100px-square.xht"> 5 <style> 6 .half { 7 display: inline-block; 8 vertical-align: top; 9 width: 50px; 10 height: 100px; 11 background: green; 12 } 13 </style> 14 <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> 15 <div style="width:100px; height:100px; background:red;"> 16 <span> 17 <div class="half"></div><div id="trouble"></div><div class="half"></div> 18 </span> 19 </div> 20 <script> 21 document.body.offsetTop; 22 trouble.style.cssFloat = "left"; 23 </script>