OLD | NEW |
(Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../../resources/check-layout.js"></script> |
| 3 <p>Given a parent block with an empty collapse-through child followed by a child
with a top margin, |
| 4 check that the parent block is pulled downwards by that margin, to the exact
top of the next |
| 5 column. The collapse-through child prevents us from correctly estimating the
logical top of the |
| 6 parent initially.</p> |
| 7 <p>Below there should be a yellow box. Inside it there should be a top-center al
igned green box.</p> |
| 8 <div id="test" style="position:relative; -webkit-columns:3; -webkit-column-gap:1
0px; column-fill:auto; width:620px; height:90px; line-height:20px; background:ye
llow;"> |
| 9 <br> |
| 10 <br> |
| 11 <br> |
| 12 <br> |
| 13 <div style="background:red;" data-offset-x="210" data-offset-y="0" data-expe
cted-height="80"> |
| 14 <div data-offset-x="210" data-offset-y="0" data-expected-height="0"></di
v> |
| 15 <div data-offset-x="210" data-offset-y="0" data-expected-height="80" sty
le="margin-top:20px; background:green;"> |
| 16 <br><br><br><br> |
| 17 </div> |
| 18 </div> |
| 19 </div> |
| 20 <script> |
| 21 checkLayout("#test"); |
| 22 </script> |
OLD | NEW |