diff --git a/Libraries/LibWeb/Layout/FormattingContext.cpp b/Libraries/LibWeb/Layout/FormattingContext.cpp index 6db7fc4b99c..4714cf39093 100644 --- a/Libraries/LibWeb/Layout/FormattingContext.cpp +++ b/Libraries/LibWeb/Layout/FormattingContext.cpp @@ -1895,11 +1895,9 @@ bool box_is_sized_as_replaced_element(Box const& box) // However, it is suggested that, if the containing block’s width does not itself depend on the replaced element’s width, // then the used value of width is calculated from the constraint equation used for block-level, non-replaced elements in normal flow. - // AD-HOC: For inline-level boxes, we don't want to end up in a situation where we apply stretch-fit sizing, - // since that would not match other browsers. Because of that, we specifically reject this case here - // instead of allowing it to proceed. - if (box.display().is_inline_outside() - && box.computed_values().height().is_auto() + // AD-HOC: If box has preferred aspect ratio but width and height are not specified, then we should + // size it as a normal box to match other browsers. + if (box.computed_values().height().is_auto() && box.computed_values().width().is_auto() && !box.has_natural_width() && !box.has_natural_height()) { diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/aspect-ratio-but-width-and-height-are-auto.txt b/Tests/LibWeb/Layout/expected/block-and-inline/aspect-ratio-but-width-and-height-are-auto.txt new file mode 100644 index 00000000000..fa5ca5fe2eb --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/aspect-ratio-but-width-and-height-are-auto.txt @@ -0,0 +1,21 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x208 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x192 children: not-inline + Box at (8,8) content-size 784x192 flex-container(row) [FFC] children: not-inline + BlockContainer at (8,8) content-size 192x192 flex-item [BFC] children: not-inline + BlockContainer at (8,8) content-size 192x192 children: not-inline + BlockContainer at (8,8) content-size 192x192 children: not-inline + BlockContainer <(anonymous)> at (200,8) content-size 36.84375x192 flex-item [BFC] children: inline + frag 0 from TextNode start: 0, length: 5, rect: [200,8 36.84375x17] baseline: 13.296875 + "hello" + TextNode <#text> + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x208] + PaintableWithLines (BlockContainer) [8,8 784x192] + PaintableBox (Box
.flex) [8,8 784x192] + PaintableWithLines (BlockContainer
.wrapper) [8,8 192x192] + PaintableWithLines (BlockContainer
.aspectratio) [8,8 192x192] + PaintableWithLines (BlockContainer
.box) [8,8 192x192] + PaintableWithLines (BlockContainer(anonymous)) [200,8 36.84375x192] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/input/block-and-inline/aspect-ratio-but-width-and-height-are-auto.html b/Tests/LibWeb/Layout/input/block-and-inline/aspect-ratio-but-width-and-height-are-auto.html new file mode 100644 index 00000000000..031e1edbc3b --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/aspect-ratio-but-width-and-height-are-auto.html @@ -0,0 +1,16 @@ +
hello \ No newline at end of file