LibWeb: Fix floating box position calculation

Now we set margins, borders and paddings for floating boxes and include
them into calculating floating box positions by using margin_box() and
margin_box_as_relative_rect().
This commit is contained in:
Egor Ananyin 2021-04-29 18:18:53 +03:00 committed by Andreas Kling
parent 3c0355a398
commit 5ae2774018
Notes: sideshowbarker 2024-07-18 18:52:38 +09:00

View File

@ -209,8 +209,8 @@ void BlockFormattingContext::compute_width_for_floating_box(Box& box)
float width_of_containing_block = box.width_of_logical_containing_block();
auto zero_value = CSS::Length::make_px(0);
auto margin_left = CSS::Length::make_auto();
auto margin_right = CSS::Length::make_auto();
auto margin_left = computed_values.margin().left.resolved_or_zero(box, width_of_containing_block);
auto margin_right = computed_values.margin().right.resolved_or_zero(box, width_of_containing_block);
const auto padding_left = computed_values.padding().left.resolved_or_zero(box, width_of_containing_block);
const auto padding_right = computed_values.padding().right.resolved_or_zero(box, width_of_containing_block);
@ -240,6 +240,12 @@ void BlockFormattingContext::compute_width_for_floating_box(Box& box)
float final_width = width.resolved_or_zero(box, width_of_containing_block).to_px(box);
box.set_width(final_width);
box.box_model().margin.left = margin_left.to_px(box);
box.box_model().margin.right = margin_right.to_px(box);
box.box_model().border.left = computed_values.border_left().width;
box.box_model().border.right = computed_values.border_right().width;
box.box_model().padding.left = padding_left.to_px(box);
box.box_model().padding.right = padding_right.to_px(box);
}
void BlockFormattingContext::compute_width_for_block_level_replaced_element_in_normal_flow(ReplacedBox& box)
@ -543,7 +549,7 @@ void BlockFormattingContext::layout_initial_containing_block(LayoutMode layout_m
static Gfx::FloatRect rect_in_coordinate_space(const Box& box, const Box& context_box)
{
Gfx::FloatRect rect { box.effective_offset(), box.size() };
Gfx::FloatRect rect = box.margin_box_as_relative_rect();
for (auto* ancestor = box.parent(); ancestor; ancestor = ancestor->parent()) {
if (is<Box>(*ancestor)) {
auto offset = downcast<Box>(*ancestor).effective_offset();
@ -579,16 +585,16 @@ void BlockFormattingContext::layout_floating_child(Box& box, Box& containing_blo
auto previous_rect = rect_in_coordinate_space(previous_floating_box, context_box());
if (previous_rect.contains_vertically(y_in_context_box)) {
// This box touches another already floating box. Stack to the right.
x = previous_floating_box.effective_offset().x() + previous_floating_box.width();
x = previous_floating_box.margin_box_as_relative_rect().x() + previous_floating_box.margin_box_as_relative_rect().width() + box.box_model().margin_box().left;
} else {
// This box does not touch another floating box, go all the way to the left.
x = 0;
x = box.box_model().margin_box().left;
// Also, forget all previous left-floating boxes while we're here since they're no longer relevant.
m_left_floating_boxes.clear();
}
} else {
// This is the first left-floating box. Go all the way to the left.
x = 0;
x = box.box_model().margin_box().left;
}
m_left_floating_boxes.append(&box);
} else if (box.computed_values().float_() == CSS::Float::Right) {
@ -597,16 +603,16 @@ void BlockFormattingContext::layout_floating_child(Box& box, Box& containing_blo
auto previous_rect = rect_in_coordinate_space(previous_floating_box, context_box());
if (previous_rect.contains_vertically(y_in_context_box)) {
// This box touches another already floating box. Stack to the left.
x = previous_floating_box.effective_offset().x() - box.width();
x = previous_floating_box.margin_box_as_relative_rect().x() - box.box_model().margin_box().right - box.width();
} else {
// This box does not touch another floating box, go all the way to the right.
x = containing_block.width() - box.width();
x = containing_block.width() - box.box_model().margin_box().right - box.width();
// Also, forget all previous right-floating boxes while we're here since they're no longer relevant.
m_right_floating_boxes.clear();
}
} else {
// This is the first right-floating box. Go all the way to the right.
x = containing_block.width() - box.width();
x = containing_block.width() - box.box_model().margin_box().right - box.width();
}
m_right_floating_boxes.append(&box);
}