Index: third_party/WebKit/LayoutTests/fast/block/float/float-on-line-large-and-small-float-below.html |
diff --git a/third_party/WebKit/LayoutTests/fast/block/float/float-on-line-large-and-small-float-below.html b/third_party/WebKit/LayoutTests/fast/block/float/float-on-line-large-and-small-float-below.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..2f2ce97f1e7a11dffd226b507332904ed8212b4e |
--- /dev/null |
+++ b/third_party/WebKit/LayoutTests/fast/block/float/float-on-line-large-and-small-float-below.html |
@@ -0,0 +1,27 @@ |
+<!DOCTYPE html> |
+<p>There should be a smaller hotpink square below a larger blue |
+ square. They should not overlap.</p> |
+<div style="position:relative; width:100px;"> |
+ <span id="inlineBlock" style="display:inline-block; width:40px; height:10px;"></span> |
+ <div id="onLine" style="float:left; width:40px; height:40px;"></div> |
+ <div id="largeBelow" style="float:left; width:100px; height:100px; background:blue;"></div> |
+ <div id="smallBelow" style="float:left; width:40px; height:40px; background:hotpink;"></div> |
+</div> |
+<div style="clear:both;"></div> |
+<script src="../../../resources/testharness.js"></script> |
+<script src="../../../resources/testharnessreport.js"></script> |
+<script> |
+test(() => { |
+ var inlineBlock = document.getElementById("inlineBlock"); |
+ var onLine = document.getElementById("onLine"); |
+ var largeBelow = document.getElementById("largeBelow"); |
+ var smallBelow = document.getElementById("smallBelow"); |
+ assert_equals(inlineBlock.offsetLeft, 40); |
+ assert_equals(onLine.offsetLeft, 0); |
+ assert_equals(onLine.offsetTop, 0); |
+ assert_equals(largeBelow.offsetLeft, 0); |
+ assert_equals(largeBelow.offsetTop, 40); |
+ assert_equals(smallBelow.offsetLeft, 0); |
+ assert_equals(smallBelow.offsetTop, 140); |
+}, "Large and smaller float pushed below line with float"); |
+</script> |