diff --git a/Tests/LibWeb/Layout/expected/flex/specified-size-suggestion-with-box-sizing-border-box.txt b/Tests/LibWeb/Layout/expected/flex/specified-size-suggestion-with-box-sizing-border-box.txt new file mode 100644 index 00000000000..c41d592c1c2 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/flex/specified-size-suggestion-with-box-sizing-border-box.txt @@ -0,0 +1,5 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x100 children: not-inline + Box at (0,0) content-size 800x100 flex-container(row) children: not-inline + ImageBox at (0,0) content-size 400x100 flex-item children: not-inline + ImageBox at (600,0) content-size 200x100 flex-item children: not-inline diff --git a/Tests/LibWeb/Layout/input/flex/specified-size-suggestion-with-box-sizing-border-box.html b/Tests/LibWeb/Layout/input/flex/specified-size-suggestion-with-box-sizing-border-box.html new file mode 100644 index 00000000000..0d8afc12309 --- /dev/null +++ b/Tests/LibWeb/Layout/input/flex/specified-size-suggestion-with-box-sizing-border-box.html @@ -0,0 +1,21 @@ +hello this text is here to make the img have a wide intrinsic size \ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp index 803c62a8b11..57100e1ac6d 100644 --- a/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp @@ -705,8 +705,10 @@ Optional FlexFormattingContext::specified_size_suggestion(FlexItem co { // If the item’s preferred main size is definite and not automatic, // then the specified size suggestion is that size. It is otherwise undefined. - if (has_definite_main_size(item.box)) - return inner_main_size(item.box); + if (has_definite_main_size(item.box)) { + // NOTE: We use get_pixel_{width,height} to ensure that CSS box-sizing is respected. + return is_row_layout() ? get_pixel_width(item.box, computed_main_size(item.box)) : get_pixel_height(item.box, computed_main_size(item.box)); + } return {}; }