| <!DOCTYPE html> |
| <style> |
| html, body { |
| margin: 0; |
| } |
| |
| .border { |
| border:1px solid #000; |
| } |
| .width-50 { |
| width: 50%; |
| } |
| .flex { |
| display: flex; |
| flex-flow: row wrap; |
| } |
| .tall { |
| height: 300px; |
| } |
| .top-50 { |
| position: relative; |
| top: 50%; |
| } |
| </style> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script src="../../resources/check-layout-th.js"></script> |
| <body onload="checkLayout('.border')"> |
| <div class="border"> |
| <div class="flex"> |
| <div class="width-50"> |
| <label class="top-50" data-offset-y="151">This should be in the center of the container</label> |
| </div> |
| <div class="width-50"> |
| <div class="tall"> |
| This is tall |
| </div> |
| </div> |
| </div> |
| </div> |
