diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/max-width-for-box-with-inline-children.txt b/Tests/LibWeb/Layout/expected/block-and-inline/max-width-for-box-with-inline-children.txt new file mode 100644 index 0000000000..64d089b70b --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/max-width-for-box-with-inline-children.txt @@ -0,0 +1,15 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (1,1) content-size 798x185.734375 [BFC] children: not-inline + BlockContainer at (10,10) content-size 204x167.734375 children: not-inline + BlockContainer at (11,11) content-size 202x165.734375 children: not-inline + BlockContainer at (12,12) content-size 200x163.734375 children: inline + line 0 width: 88.765625, height: 54.578125, bottom: 54.578125, baseline: 42.265625 + frag 0 from TextNode start: 0, length: 4, rect: [12,12 88.765625x54.578125] + "well" + line 1 width: 115.125, height: 54.578125, bottom: 109.15625, baseline: 42.265625 + frag 0 from TextNode start: 5, length: 5, rect: [12,66.578125 115.125x54.578125] + "hello" + line 2 width: 172.984375, height: 54.578125, bottom: 163.734375, baseline: 42.265625 + frag 0 from TextNode start: 11, length: 7, rect: [12,121.15625 172.984375x54.578125] + "friends" + TextNode <#text> diff --git a/Tests/LibWeb/Layout/input/block-and-inline/max-width-for-box-with-inline-children.html b/Tests/LibWeb/Layout/input/block-and-inline/max-width-for-box-with-inline-children.html new file mode 100644 index 0000000000..99a6aceeaa --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/max-width-for-box-with-inline-children.html @@ -0,0 +1,12 @@ +
well hello friends \ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index 245d051f6f..543bcc761c 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -505,8 +505,17 @@ void BlockFormattingContext::layout_inline_children(BlockContainer const& block_ layout_mode, available_space); - if (!block_container_state.has_definite_width()) - block_container_state.set_content_width(context.automatic_content_width()); + if (!block_container_state.has_definite_width()) { + // NOTE: max-width for boxes with inline children can only be applied after inside layout is done + // and width of box content is known + auto used_width_px = context.automatic_content_width(); + if (!should_treat_max_width_as_none(block_container, available_space.width)) { + auto max_width_px = calculate_inner_width(block_container, available_space.width, block_container.computed_values().max_width()).to_px(block_container); + if (used_width_px > max_width_px) + used_width_px = max_width_px; + } + block_container_state.set_content_width(used_width_px); + } if (!block_container_state.has_definite_height()) block_container_state.set_content_height(context.automatic_content_height()); } diff --git a/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp index fa5415d0c5..8b325af4da 100644 --- a/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/FormattingContext.cpp @@ -1837,6 +1837,14 @@ bool FormattingContext::should_treat_max_width_as_none(Box const& box, Available if (!m_state.get(*box.non_anonymous_containing_block()).has_definite_width()) return true; } + if (box.children_are_inline()) { + if (max_width.is_fit_content() && available_width.is_intrinsic_sizing_constraint()) + return true; + if (max_width.is_max_content() && available_width.is_max_content()) + return true; + if (max_width.is_min_content() && available_width.is_min_content()) + return true; + } return false; }