Bläddra i källkod

LibWeb: Do not treat size of abspos items as definite

This fixes the issue when size of abspos items is considered to be
resolvable without performing layout which is not correct in the
scenarious when top/right/bottom/left properties are not auto.
Aliaksandr Kalenik 2 år sedan
förälder
incheckning
473848be0e

+ 7 - 0
Tests/LibWeb/Layout/expected/abspos-box-with-replaced-element.txt

@@ -0,0 +1,7 @@
+Viewport <#document> at (0,0) content-size 800x600 children: not-inline
+  BlockContainer <html> at (1,1) content-size 798x0 [BFC] children: not-inline
+    BlockContainer <body> at (10,10) content-size 500x100 positioned [BFC] children: not-inline
+      BlockContainer <div.image-container> at (261,11) content-size 248x28.4836 positioned [BFC] children: inline
+        line 0 width: 250, height: 28.4836, bottom: 28.4836, baseline: 28.4836
+          frag 0 from ImageBox start: 0, length: 0, rect: [262,12 248x26.4836]
+        ImageBox <img> at (262,12) content-size 248x26.4836 children: not-inline

+ 22 - 0
Tests/LibWeb/Layout/input/abspos-box-with-replaced-element.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html><style>
+    * {
+        border: 1px solid white;
+    }
+    html {
+        background: black;
+    }
+    body {
+        position: absolute;
+        width: 500px;
+        height: 100px;
+        background: maroon;
+    }
+    img {
+        max-width: 100%;
+    }
+    .image-container {
+        position: absolute;
+        background: green;
+        left: 250px;
+    }
+</style><body><div class="image-container"><img src="img.webp">

BIN
Tests/LibWeb/Layout/input/img.webp


+ 1 - 0
Userland/Libraries/LibWeb/Layout/LayoutState.cpp

@@ -215,6 +215,7 @@ void LayoutState::UsedValues::set_node(NodeWithStyleAndBoxModelMetrics& node, Us
             // NOTE: The width of a non-flex-item block is considered definite if it's auto and the containing block has definite width.
             if (width
                 && !node.is_floating()
+                && !node.is_absolutely_positioned()
                 && node.display().is_block_outside()
                 && node.parent()
                 && !node.parent()->is_floating()