Chromium Code Reviews| Index: LayoutTests/fast/block/margin-collapse/bfc-beside-float-complex-margin-collapsing.html |
| diff --git a/LayoutTests/fast/block/margin-collapse/bfc-beside-float-complex-margin-collapsing.html b/LayoutTests/fast/block/margin-collapse/bfc-beside-float-complex-margin-collapsing.html |
| new file mode 100644 |
| index 0000000000000000000000000000000000000000..b4894cf3c9433427433b96cf48a9658592d213bf |
| --- /dev/null |
| +++ b/LayoutTests/fast/block/margin-collapse/bfc-beside-float-complex-margin-collapsing.html |
| @@ -0,0 +1,30 @@ |
| +<!DOCTYPE html> |
| +<p>Given a float followed by a regular block with the same height as the float, then a block B with |
| + a negative margin, followed by a block with with overflow:hidden. Check that the |
| + overflow:hidden block doesn't overlap with the float, and also that it takes up all available |
| + space (but not more) beside the float. There's an empty collapse-through block before B, so |
| + that our initial logical top estimate fails and we have to relayout. When laying out again, we |
| + have to detect that the float that we first thought didn't affect the overflow:hidden block now |
| + affects it.</p> |
| +<p>Below there should be an olive square to the left of a navy square. The navy square should be |
| + slightly larger than the olive one, and there should be spacing between them. They should not |
| + overlap.</p> |
| +<div style="width:18em;"> |
| + <div> |
| + <div style="float:left; width:8em; height:8em; margin-right:1em; background:olive;"></div> |
| + <div style="height:8em;"></div> |
| + <div> |
| + <!-- Here's an empty block that we can just collapse through, but we don't realize that |
| + when calculating our initial top estimate on its parent, so we have to relayout |
| + when it turns out that a negative margin has pulled us upwards (and suddenly we |
| + have something block-level that's affected by the float). --> |
| + <div></div> |
| + |
| + <div style="margin-top:-8em;"></div> |
| + |
| + <!-- Here's a block-level element that is affected by floats, because it's a table. We |
| + could have used e.g. an overflow:hidden DIV for the same effect. --> |
| + <div style="overflow:hidden; height:9em; background:navy;"> |
|
Julien - ping for review
2015/09/04 17:40:10
The tests really look like a check-layout.js tests
|
| + </div> |
| + </div> |
| +</div> |