From 1ebae7a779a4dfabaeb836b6b44f1b3c5ed896c1 Mon Sep 17 00:00:00 2001 From: Andreas Kling Date: Mon, 8 May 2023 14:48:03 +0200 Subject: [PATCH] LibWeb: Stop changing width of block-level flex containers during layout If the parent BFC can come up with a nice stretch-fit width for the flex container, it will have already done so *before* even entering flex layout. There's no need to do it again, midway through the flex layout algorithm. This wasn't just unnecessary, but we were also doing it incorrectly and not taking margins into account when calculating the amount of available space for stretch-fit. This led to oversized flex containers in the presence of negative margins. Fixes #18614 --- ...-auto-contributes-to-intrinsic-size-of-parent.txt | 2 +- ...th-max-width-and-negative-margin-in-same-axis.txt | 7 +++++++ .../expected/table/in-auto-height-flex-item.txt | 2 +- ...h-max-width-and-negative-margin-in-same-axis.html | 12 ++++++++++++ .../LibWeb/Layout/BlockFormattingContext.cpp | 5 +++-- 5 files changed, 24 insertions(+), 4 deletions(-) create mode 100644 Tests/LibWeb/Layout/expected/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.txt create mode 100644 Tests/LibWeb/Layout/input/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.html diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/max-width-on-child-block-with-width-auto-contributes-to-intrinsic-size-of-parent.txt b/Tests/LibWeb/Layout/expected/block-and-inline/max-width-on-child-block-with-width-auto-contributes-to-intrinsic-size-of-parent.txt index 6912a85853..a4e3082716 100644 --- a/Tests/LibWeb/Layout/expected/block-and-inline/max-width-on-child-block-with-width-auto-contributes-to-intrinsic-size-of-parent.txt +++ b/Tests/LibWeb/Layout/expected/block-and-inline/max-width-on-child-block-with-width-auto-contributes-to-intrinsic-size-of-parent.txt @@ -1,6 +1,6 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (1,1) content-size 798x39.46875 [BFC] children: not-inline - Box at (10,10) content-size 764x21.46875 flex-container(row) [FFC] children: not-inline + Box at (10,10) content-size 780x21.46875 flex-container(row) [FFC] children: not-inline BlockContainer at (11,11) content-size 202x19.46875 flex-item [BFC] children: not-inline BlockContainer at (12,12) content-size 200x17.46875 children: inline line 0 width: 45.15625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 diff --git a/Tests/LibWeb/Layout/expected/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.txt b/Tests/LibWeb/Layout/expected/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.txt new file mode 100644 index 0000000000..7e7ef1d34f --- /dev/null +++ b/Tests/LibWeb/Layout/expected/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.txt @@ -0,0 +1,7 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x116 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x100 children: not-inline + BlockContainer at (8,8) content-size 100x100 children: not-inline + Box at (-92,8) content-size 200x100 flex-container(row) [FFC] children: not-inline + BlockContainer <(anonymous)> at (-92,8) content-size 0x0 [BFC] children: inline + TextNode <#text> diff --git a/Tests/LibWeb/Layout/expected/table/in-auto-height-flex-item.txt b/Tests/LibWeb/Layout/expected/table/in-auto-height-flex-item.txt index 93f4bd5f14..8286cb8d25 100644 --- a/Tests/LibWeb/Layout/expected/table/in-auto-height-flex-item.txt +++ b/Tests/LibWeb/Layout/expected/table/in-auto-height-flex-item.txt @@ -1,6 +1,6 @@ Viewport <#document> at (0,0) content-size 800x600 children: not-inline BlockContainer at (1,1) content-size 798x39.46875 [BFC] children: not-inline - Box at (10,10) content-size 764x21.46875 flex-container(row) [FFC] children: not-inline + Box at (10,10) content-size 780x21.46875 flex-container(row) [FFC] children: not-inline BlockContainer at (11,11) content-size 41.78125x19.46875 flex-item [BFC] children: not-inline TableWrapper <(anonymous)> at (11,11) content-size 41.78125x19.46875 [BFC] children: not-inline TableBox <(anonymous)> at (11,11) content-size 41.78125x19.46875 [TFC] children: not-inline diff --git a/Tests/LibWeb/Layout/input/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.html b/Tests/LibWeb/Layout/input/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.html new file mode 100644 index 0000000000..500860daad --- /dev/null +++ b/Tests/LibWeb/Layout/input/flex/flex-container-with-max-width-and-negative-margin-in-same-axis.html @@ -0,0 +1,12 @@ +
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index 39b5ce67bb..2a92319614 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -1056,9 +1056,10 @@ CSSPixels BlockFormattingContext::greatest_child_width(Box const& box) const return max_width; } -void BlockFormattingContext::determine_width_of_child(Box const& box, AvailableSpace const& available_space) +void BlockFormattingContext::determine_width_of_child(Box const&, AvailableSpace const&) { - compute_width(box, available_space); + // NOTE: We don't do anything here, since we'll have already determined the width of the child + // before recursing into nested layout within the child. } void BlockFormattingContext::determine_height_of_child(Box const& box, AvailableSpace const& available_space)