Просмотр исходного кода

LibWeb: Fix width calculation for floating replaced elements

The path for floating, replaced elements must not fall through to the
path taken for floating, non-replaced elements. The former works like
inline replaced elements, while the latter uses a completely different
algorithm which doesn't account for intrinsic ratio. Falling through
overrides the correct value computed by the former.

Fixes #19061.
Andi Gallo 2 лет назад
Родитель
Сommit
1e526af430

+ 3 - 3
Tests/LibWeb/Layout/expected/resolve-height-of-containing-block.txt

@@ -8,10 +8,10 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
       BlockContainer <div.foo> at (8,16) content-size 1280x800 children: not-inline
       BlockContainer <div.foo> at (8,16) content-size 1280x800 children: not-inline
         BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
         BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
           TextNode <#text>
           TextNode <#text>
-        BlockContainer <div> at (8,16) content-size 1280x600 children: not-inline
+        BlockContainer <div> at (8,16) content-size 1280x400 children: not-inline
           BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
           BlockContainer <(anonymous)> at (8,16) content-size 1280x0 children: inline
             TextNode <#text>
             TextNode <#text>
-            ImageBox <img> at (88,16) content-size 1200x600 floating children: not-inline
+            ImageBox <img> at (488,16) content-size 800x400 floating children: not-inline
             TextNode <#text>
             TextNode <#text>
           BlockContainer <p> at (8,16) content-size 1280x17.46875 children: inline
           BlockContainer <p> at (8,16) content-size 1280x17.46875 children: inline
             line 0 width: 37.21875, height: 17.46875, bottom: 17.46875, baseline: 13.53125
             line 0 width: 37.21875, height: 17.46875, bottom: 17.46875, baseline: 13.53125
@@ -20,7 +20,7 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline
             TextNode <#text>
             TextNode <#text>
           BlockContainer <(anonymous)> at (8,49.46875) content-size 1280x0 children: inline
           BlockContainer <(anonymous)> at (8,49.46875) content-size 1280x0 children: inline
             TextNode <#text>
             TextNode <#text>
-        BlockContainer <(anonymous)> at (8,616) content-size 1280x0 children: inline
+        BlockContainer <(anonymous)> at (8,416) content-size 1280x0 children: inline
           TextNode <#text>
           TextNode <#text>
       BlockContainer <(anonymous)> at (8,816) content-size 784x0 children: inline
       BlockContainer <(anonymous)> at (8,816) content-size 784x0 children: inline
         TextNode <#text>
         TextNode <#text>

+ 1 - 1
Tests/LibWeb/Layout/input/resolve-height-of-containing-block.html

@@ -8,7 +8,7 @@
         }
         }
 
 
         .foo div {
         .foo div {
-            height: 600px;
+            height: 400px;
         }
         }
 
 
         .foo div img {
         .foo div img {

+ 7 - 1
Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp

@@ -137,10 +137,16 @@ void BlockFormattingContext::compute_width(Box const& box, AvailableSpace const&
         // FIXME: This const_cast is gross.
         // FIXME: This const_cast is gross.
         const_cast<ReplacedBox&>(replaced).prepare_for_replaced_layout();
         const_cast<ReplacedBox&>(replaced).prepare_for_replaced_layout();
         compute_width_for_block_level_replaced_element_in_normal_flow(replaced, remaining_available_space);
         compute_width_for_block_level_replaced_element_in_normal_flow(replaced, remaining_available_space);
-        // NOTE: We don't return here.
+        if (box.is_floating()) {
+            // 10.3.6 Floating, replaced elements:
+            // https://www.w3.org/TR/CSS22/visudet.html#float-replaced-width
+            return;
+        }
     }
     }
 
 
     if (box.is_floating()) {
     if (box.is_floating()) {
+        // 10.3.5 Floating, non-replaced elements:
+        // https://www.w3.org/TR/CSS22/visudet.html#float-width
         compute_width_for_floating_box(box, available_space);
         compute_width_for_floating_box(box, available_space);
         return;
         return;
     }
     }