| <!DOCTYPE html> |
| |
| <link rel="stylesheet" href="resources/region-style.css"></link> |
| <script type="text/javascript" charset="utf-8" src="resources/helper.js"></script> |
| |
| <style> |
| body { margin: 10px; } |
| |
| .box { |
| width: 50px; |
| height: 50px; |
| float: left; |
| } |
| |
| #region1 { |
| position: absolute; |
| padding: 10px; |
| } |
| |
| #region2 { |
| position: absolute; |
| left: 100px; |
| border: 10px solid black; |
| } |
| |
| #region3 { |
| position: absolute; |
| left: 200px; |
| padding: 10px; |
| border: 10px solid black; |
| } |
| |
| .finished #region1, .finished #region2, .finished #region3 { |
| display: none; |
| } |
| </style> |
| |
| <div class="flowArticle"> |
| <div id="green" class="greenBox"></div> |
| <div id="blue" class="blueBox"></div> |
| <div id="orange" class="orangeBox"></div> |
| </div> |
| |
| <div id="region1" class="regionArticle box"></div> |
| <div id="region2" class="regionArticle box"></div> |
| <div id="region3" class="regionArticle box"></div> |
| |
| <script> |
| if (window.layoutTestController) |
| layoutTestController.dumpAsText(); |
| |
| var expectedBoundingRects = { |
| green: [20, 20, 70, 70, 50, 50], |
| blue: [20, 110, 70, 160, 50, 50], |
| orange: [30, 220, 80, 270, 50, 50] |
| }; |
| |
| if (testBoundingRects(expectedBoundingRects)) |
| document.body.className = "finished"; |
| </script> |