| <!DOCTYPE html> |
| <style> |
| body { margin: 0px; padding; 0px; } |
| #div { display:block; width: 50px; height: 50px; background-color: green; } |
| .float { width: 50px; height: 50px; background-color: green; float: left; } |
| </style> |
| <div id="container" style="width: 500px;"> |
| <div style="height: 50px; width: 50px;"></div> |
| <span>X</span> |
| <div class="float"></div> |
| <div id="div"></div> |
| <div id="float" class="float" data-offset-y=50></div> |
| <span>X</span> |
| </div> |
| <p>crbug.com/585064: Two contiguous anonymous blocks with inline content should be merged together. There should be a single green rectangle below.</p> |
| <script src="../../../resources/check-layout.js"></script> |
| <script> |
| document.body.offsetTop; |
| document.getElementById("div").style.float = 'left'; |
| checkLayout("#container"); |
| </script> |