diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/float-max-content-containing-block-flex-display.txt b/Tests/LibWeb/Layout/expected/block-and-inline/float-max-content-containing-block-flex-display.txt new file mode 100644 index 0000000000..d2f7a69467 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/float-max-content-containing-block-flex-display.txt @@ -0,0 +1,27 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x0 children: not-inline + Box at (8,8) content-size 23.609375x17.46875 floating flex-container(row) [FFC] children: not-inline + BlockContainer
at (8,8) content-size 23.609375x17.46875 flex-item [BFC] children: not-inline + BlockContainer
at (8,8) content-size 23.609375x17.46875 floating [BFC] children: not-inline + BlockContainer at (8,8) content-size 14.265625x17.46875 floating [BFC] children: inline + line 0 width: 14.265625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 1, rect: [8,8 14.265625x17.46875] + "A" + TextNode <#text> + BlockContainer at (22.265625,8) content-size 9.34375x17.46875 floating [BFC] children: inline + line 0 width: 9.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 1, rect: [22.265625,8 9.34375x17.46875] + "B" + TextNode <#text> + +PaintableWithLines (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x600] + PaintableWithLines (BlockContainer) [8,8 784x0] overflow: [8,8 23.609375x17.46875] + PaintableBox (Box
.display_flex) [8,8 23.609375x17.46875] + PaintableWithLines (BlockContainer
) [8,8 23.609375x17.46875] + PaintableWithLines (BlockContainer
) [8,8 23.609375x17.46875] + PaintableWithLines (BlockContainer) [8,8 14.265625x17.46875] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer) [22.265625,8 9.34375x17.46875] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/float-max-content-containing-block.txt b/Tests/LibWeb/Layout/expected/block-and-inline/float-max-content-containing-block.txt new file mode 100644 index 0000000000..f04fe95628 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/float-max-content-containing-block.txt @@ -0,0 +1,23 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x0 children: not-inline + BlockContainer
at (8,8) content-size 23.609375x17.46875 floating [BFC] children: not-inline + BlockContainer at (8,8) content-size 14.265625x17.46875 floating [BFC] children: inline + line 0 width: 14.265625, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 1, rect: [8,8 14.265625x17.46875] + "A" + TextNode <#text> + BlockContainer at (22.265625,8) content-size 9.34375x17.46875 floating [BFC] children: inline + line 0 width: 9.34375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 1, rect: [22.265625,8 9.34375x17.46875] + "B" + TextNode <#text> + +PaintableWithLines (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x600] + PaintableWithLines (BlockContainer) [8,8 784x0] overflow: [8,8 23.609375x17.46875] + PaintableWithLines (BlockContainer
) [8,8 23.609375x17.46875] + PaintableWithLines (BlockContainer) [8,8 14.265625x17.46875] + TextPaintable (TextNode<#text>) + PaintableWithLines (BlockContainer) [22.265625,8 9.34375x17.46875] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/input/block-and-inline/float-max-content-containing-block-flex-display.html b/Tests/LibWeb/Layout/input/block-and-inline/float-max-content-containing-block-flex-display.html new file mode 100644 index 0000000000..9d6580dc1b --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/float-max-content-containing-block-flex-display.html @@ -0,0 +1,13 @@ +
AB
\ No newline at end of file diff --git a/Tests/LibWeb/Layout/input/block-and-inline/float-max-content-containing-block.html b/Tests/LibWeb/Layout/input/block-and-inline/float-max-content-containing-block.html new file mode 100644 index 0000000000..1f57df5973 --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/float-max-content-containing-block.html @@ -0,0 +1,9 @@ +
AB
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index f53e30330e..139fd3d8ea 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -290,10 +290,7 @@ void BlockFormattingContext::compute_width_for_floating_box(Box const& box, Avai auto& computed_values = box.computed_values(); auto zero_value = CSS::Length::make_px(0); - auto width_of_containing_block = available_space.width.to_px_or_zero(); - auto width_of_containing_block_as_length_for_resolve = CSS::Length::make_px(width_of_containing_block); - if (!available_space.width.is_definite()) - width_of_containing_block_as_length_for_resolve = CSS::Length::make_px(0); + auto width_of_containing_block_as_length_for_resolve = CSS::Length::make_px(available_space.width.to_px_or_zero()); auto margin_left = computed_values.margin().left().resolved(box, width_of_containing_block_as_length_for_resolve); auto margin_right = computed_values.margin().right().resolved(box, width_of_containing_block_as_length_for_resolve); @@ -309,18 +306,24 @@ void BlockFormattingContext::compute_width_for_floating_box(Box const& box, Avai auto compute_width = [&](auto width) { // If 'width' is computed as 'auto', the used value is the "shrink-to-fit" width. if (width.is_auto()) { - - // Find the available width: in this case, this is the width of the containing - // block minus the used values of 'margin-left', 'border-left-width', 'padding-left', - // 'padding-right', 'border-right-width', 'margin-right', and the widths of any relevant scroll bars. - auto available_width = width_of_containing_block - - margin_left.to_px(box) - computed_values.border_left().width - padding_left - - padding_right - computed_values.border_right().width - margin_right.to_px(box); - auto result = calculate_shrink_to_fit_widths(box); - // Then the shrink-to-fit width is: min(max(preferred minimum width, available width), preferred width). - width = CSS::Length::make_px(min(max(result.preferred_minimum_width, available_width), result.preferred_width)); + if (available_space.width.is_definite()) { + // Find the available width: in this case, this is the width of the containing + // block minus the used values of 'margin-left', 'border-left-width', 'padding-left', + // 'padding-right', 'border-right-width', 'margin-right', and the widths of any relevant scroll bars. + auto available_width = available_space.width.to_px_or_zero() + - margin_left.to_px(box) - computed_values.border_left().width - padding_left + - padding_right - computed_values.border_right().width - margin_right.to_px(box); + // Then the shrink-to-fit width is: min(max(preferred minimum width, available width), preferred width). + width = CSS::Length::make_px(min(max(result.preferred_minimum_width, available_width), result.preferred_width)); + } else if (available_space.width.is_indefinite() || available_space.width.is_max_content()) { + // Fold the formula for shrink-to-fit width for indefinite and max-content available width. + width = CSS::Length::make_px(result.preferred_width); + } else { + // Fold the formula for shrink-to-fit width for min-content available width. + width = CSS::Length::make_px(min(result.preferred_minimum_width, result.preferred_width)); + } } return width; @@ -898,7 +901,6 @@ void BlockFormattingContext::layout_floating_box(Box const& box, BlockContainer VERIFY(box.is_floating()); auto& box_state = m_state.get_mutable(box); - CSSPixels width_of_containing_block = available_space.width.to_px_or_zero(); resolve_vertical_box_model_metrics(box); @@ -957,7 +959,11 @@ void BlockFormattingContext::layout_floating_box(Box const& box, BlockContainer bool fits_next_to_preceding_float = false; if (side == FloatSide::Left) { tentative_offset_from_edge = preceding_float.offset_from_edge + preceding_float_state.content_width() + preceding_float_state.margin_box_right() + box_state.margin_box_left(); - fits_next_to_preceding_float = (tentative_offset_from_edge + box_state.content_width() + box_state.margin_box_right()) <= width_of_containing_block; + if (available_space.width.is_definite()) { + fits_next_to_preceding_float = (tentative_offset_from_edge + box_state.content_width() + box_state.margin_box_right()) <= available_space.width.to_px_or_zero(); + } else if (available_space.width.is_max_content() || available_space.width.is_indefinite()) { + fits_next_to_preceding_float = true; + } } else { tentative_offset_from_edge = preceding_float.offset_from_edge + preceding_float_state.margin_box_left() + box_state.margin_box_right() + box_state.content_width(); fits_next_to_preceding_float = tentative_offset_from_edge >= 0;