From 0d9c28add9fd28898e2fb64d87cae6fcf88a55dd Mon Sep 17 00:00:00 2001 From: Andreas Kling Date: Sat, 26 Mar 2022 22:10:09 +0100 Subject: [PATCH] LibWeb: Don't collapse horizontal margins between floating boxes CSS 2.2 says "Horizontal margins never collapse." So instead of collapsing them, we now add them together, which makes negative margins between floating boxes work beautifully. --- .../LibWeb/Layout/BlockFormattingContext.cpp | 27 ++++--------------- 1 file changed, 5 insertions(+), 22 deletions(-) diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index 21665601b8..7ff85556f6 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -601,12 +601,8 @@ void BlockFormattingContext::layout_floating_box(Box const& box, BlockContainer place_block_level_element_in_normal_flow_horizontally(box, containing_block); } + // Then we float it to the left or right. auto float_box = [&](FloatSide side, FloatSideData& side_data) { - auto first_edge = [&](FormattingState::NodeState const& thing) { return side == FloatSide::Left ? thing.margin_left : thing.margin_right; }; - auto second_edge = [&](FormattingState::NodeState const& thing) { return side == FloatSide::Right ? thing.margin_left : thing.margin_right; }; - - // Then we float it to the left or right. - float offset_from_edge = 0; auto float_to_edge = [&] { if (side == FloatSide::Left) @@ -625,29 +621,16 @@ void BlockFormattingContext::layout_floating_box(Box const& box, BlockContainer side_data.y_offset = 0; } else { auto& previous_box = side_data.current_boxes.last(); - auto const& previous_box_state = m_state.get(previous_box.box); - - auto margin_collapsed_with_previous = max( - second_edge(previous_box_state), - first_edge(box_state)); float wanted_offset_from_edge = 0; bool fits_on_line = false; if (side == FloatSide::Left) { - auto previous_right_edge = side_data.current_width - - previous_box_state.margin_right - + margin_collapsed_with_previous; - - wanted_offset_from_edge = previous_right_edge + box_state.border_left + box_state.padding_left; - fits_on_line = (wanted_offset_from_edge + box_state.content_width + box_state.padding_right + box_state.border_right + box_state.margin_right) <= width_of_containing_block; + wanted_offset_from_edge = side_data.current_width + box_state.margin_box_left(); + fits_on_line = (wanted_offset_from_edge + box_state.content_width + box_state.margin_box_right()) <= width_of_containing_block; } else { - auto previous_left_edge = side_data.current_width - - previous_box_state.margin_left - + margin_collapsed_with_previous; - - wanted_offset_from_edge = previous_left_edge + box_state.border_right + box_state.padding_right + box_state.content_width; - fits_on_line = (wanted_offset_from_edge - box_state.padding_left - box_state.border_left - box_state.margin_left) >= 0; + wanted_offset_from_edge = side_data.current_width + box_state.margin_box_right() + box_state.content_width; + fits_on_line = (wanted_offset_from_edge - box_state.margin_box_left()) >= 0; } if (fits_on_line) {