diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/max-width-wrapped-in-max-content.txt b/Tests/LibWeb/Layout/expected/block-and-inline/max-width-wrapped-in-max-content.txt new file mode 100644 index 0000000000..f0e09865dd --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/max-width-wrapped-in-max-content.txt @@ -0,0 +1,35 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x121.15625 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x105.15625 children: not-inline + BlockContainer at (8,8) content-size 270x105.15625 children: not-inline + BlockContainer at (8,8) content-size 270x105.15625 children: not-inline + BlockContainer <(anonymous)> at (8,8) content-size 270x105.15625 children: inline + line 0 width: 261.0625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 1, length: 35, rect: [8,8 261.0625x17.46875] + "hello hello hello hello hello hello" + line 1 width: 261.0625, height: 17.9375, bottom: 35.40625, baseline: 13.53125 + frag 0 from TextNode start: 37, length: 35, rect: [8,25 261.0625x17.46875] + "hello hello hello hello hello hello" + line 2 width: 261.0625, height: 18.40625, bottom: 53.34375, baseline: 13.53125 + frag 0 from TextNode start: 73, length: 35, rect: [8,42 261.0625x17.46875] + "hello hello hello hello hello hello" + line 3 width: 261.0625, height: 17.875, bottom: 70.28125, baseline: 13.53125 + frag 0 from TextNode start: 109, length: 35, rect: [8,60 261.0625x17.46875] + "hello hello hello hello hello hello" + line 4 width: 261.0625, height: 18.34375, bottom: 88.21875, baseline: 13.53125 + frag 0 from TextNode start: 145, length: 35, rect: [8,77 261.0625x17.46875] + "hello hello hello hello hello hello" + line 5 width: 81.6875, height: 17.8125, bottom: 105.15625, baseline: 13.53125 + frag 0 from TextNode start: 181, length: 11, rect: [8,95 81.6875x17.46875] + "hello hello" + TextNode <#text> + BlockContainer
at (8,113.15625) content-size 270x0 children: not-inline + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x121.15625] + PaintableWithLines (BlockContainer) [8,8 784x105.15625] + PaintableWithLines (BlockContainer
.wrapper) [8,8 270x105.15625] + PaintableWithLines (BlockContainer
.constrained) [8,8 270x105.15625] + PaintableWithLines (BlockContainer(anonymous)) [8,8 270x105.15625] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer
) [8,113.15625 270x0] diff --git a/Tests/LibWeb/Layout/expected/table/cell-with-max-width.txt b/Tests/LibWeb/Layout/expected/table/cell-with-max-width.txt new file mode 100644 index 0000000000..80c904e1a0 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/table/cell-with-max-width.txt @@ -0,0 +1,43 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x127.15625 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x111.15625 children: not-inline + TableWrapper <(anonymous)> at (8,8) content-size 276x111.15625 [BFC] children: not-inline + Box at (8,8) content-size 276x111.15625 table-box [TFC] children: not-inline + Box at (8,8) content-size 272x107.15625 table-row-group children: not-inline + Box at (10,10) content-size 272x107.15625 table-row children: not-inline + BlockContainer
at (11,11) content-size 270x105.15625 table-cell [BFC] children: not-inline + BlockContainer
at (11,11) content-size 270x105.15625 children: not-inline + BlockContainer <(anonymous)> at (11,11) content-size 270x105.15625 children: inline + line 0 width: 261.0625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 1, length: 35, rect: [11,11 261.0625x17.46875] + "hello hello hello hello hello hello" + line 1 width: 261.0625, height: 17.9375, bottom: 35.40625, baseline: 13.53125 + frag 0 from TextNode start: 37, length: 35, rect: [11,28 261.0625x17.46875] + "hello hello hello hello hello hello" + line 2 width: 261.0625, height: 18.40625, bottom: 53.34375, baseline: 13.53125 + frag 0 from TextNode start: 73, length: 35, rect: [11,45 261.0625x17.46875] + "hello hello hello hello hello hello" + line 3 width: 261.0625, height: 17.875, bottom: 70.28125, baseline: 13.53125 + frag 0 from TextNode start: 109, length: 35, rect: [11,63 261.0625x17.46875] + "hello hello hello hello hello hello" + line 4 width: 261.0625, height: 18.34375, bottom: 88.21875, baseline: 13.53125 + frag 0 from TextNode start: 145, length: 35, rect: [11,80 261.0625x17.46875] + "hello hello hello hello hello hello" + line 5 width: 81.6875, height: 17.8125, bottom: 105.15625, baseline: 13.53125 + frag 0 from TextNode start: 181, length: 11, rect: [11,98 81.6875x17.46875] + "hello hello" + TextNode <#text> + BlockContainer
at (11,116.15625) content-size 270x0 children: not-inline + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x127.15625] + PaintableWithLines (BlockContainer) [8,8 784x111.15625] + PaintableWithLines (TableWrapper(anonymous)) [8,8 276x111.15625] + PaintableBox (Box) [8,8 276x111.15625] + PaintableBox (Box) [8,8 272x107.15625] overflow: [8,8 274x109.15625] + PaintableBox (Box) [10,10 272x107.15625] + PaintableWithLines (BlockContainer
) [10,10 272x107.15625] + PaintableWithLines (BlockContainer
) [11,11 270x105.15625] + PaintableWithLines (BlockContainer(anonymous)) [11,11 270x105.15625] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer
) [11,116.15625 270x0] diff --git a/Tests/LibWeb/Layout/input/block-and-inline/max-width-wrapped-in-max-content.html b/Tests/LibWeb/Layout/input/block-and-inline/max-width-wrapped-in-max-content.html new file mode 100644 index 0000000000..5d0b48da22 --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/max-width-wrapped-in-max-content.html @@ -0,0 +1,8 @@ +
+hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello +hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello +
\ No newline at end of file diff --git a/Tests/LibWeb/Layout/input/table/cell-with-max-width.html b/Tests/LibWeb/Layout/input/table/cell-with-max-width.html new file mode 100644 index 0000000000..0d219bd0b7 --- /dev/null +++ b/Tests/LibWeb/Layout/input/table/cell-with-max-width.html @@ -0,0 +1,8 @@ +
+hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello +hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello hello +
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index c06f4e0422..5afcb0394d 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -751,8 +751,28 @@ void BlockFormattingContext::layout_block_level_children(BlockContainer const& b if (layout_mode == LayoutMode::IntrinsicSizing) { auto& block_container_state = m_state.get_mutable(block_container); - if (!block_container_state.has_definite_width()) - block_container_state.set_content_width(greatest_child_width(block_container)); + if (!block_container_state.has_definite_width()) { + auto width = greatest_child_width(block_container); + auto computed_values = block_container.computed_values(); + // NOTE: Min and max constraints are not applied to a box that is being sized as intrinsic because + // according to css-sizing-3 spec: + // The min-content size of a box in each axis is the size it would have if it was a float given an + // auto size in that axis (and no minimum or maximum size in that axis) and if its containing block + // was zero-sized in that axis. + if (block_container_state.width_constraint == SizeConstraint::None) { + if (!should_treat_max_width_as_none(block_container, available_space.width)) { + auto max_width = calculate_inner_width(block_container, available_space.width, + computed_values.max_width()); + width = min(width, max_width.to_px(block_container)); + } + if (!computed_values.min_width().is_auto()) { + auto min_width = calculate_inner_width(block_container, available_space.width, + computed_values.min_width()); + width = max(width, min_width.to_px(block_container)); + } + } + block_container_state.set_content_width(width); + } if (!block_container_state.has_definite_height()) block_container_state.set_content_height(bottom_of_lowest_margin_box); }