RGBCube/serenity
1
Fork 0
mirror of https://github.com/RGBCube/serenity synced 2025-07-26 19:27:45 +00:00
Code Issues Activity Actions

LibWeb: Use correct top content edge when calculating auto block heights

Browse source 
When the spec tells us to measure from the top content edge of a block,
that just means we should measure from Y=0. We don't need to go looking
for a child box with a negative top offset and measure from there.
This commit is contained in:
Andreas Kling 2022-03-28 21:02:13 +02:00
parent 4e81663b31
commit a6eb031058
1 changed files with 4 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

28
Userland/Libraries/LibWeb/Layout/FormattingContext.cpp
View file

@ -210,21 +210,12 @@ float FormattingContext::compute_auto_height_for_block_level_element(FormattingS
// The element's height is the distance from its top content edge to the first applicable of the following: // The element's height is the distance from its top content edge to the first applicable of the following:
// 1. the bottom edge of the last line box, if the box establishes a inline formatting context with one or more lines // 1. the bottom edge of the last line box, if the box establishes a inline formatting context with one or more lines
if (box.children_are_inline() && !box_state.line_boxes.is_empty()) { if (box.children_are_inline() && !box_state.line_boxes.is_empty())
// Find the top content edge (if negative). return box_state.line_boxes.last().bottom();
float top_content_edge = 0;
for (auto const& fragment : box_state.line_boxes.first().fragments()) {
float fragment_top_content_edge = fragment.offset().y() - fragment.border_box_top();
if (fragment_top_content_edge < top_content_edge)
top_content_edge = fragment_top_content_edge;
}
return box_state.line_boxes.last().bottom() - top_content_edge;
}
// 2. the bottom edge of the bottom (possibly collapsed) margin of its last in-flow child, if the child's bottom margin does not collapse with the element's bottom margin // 2. the bottom edge of the bottom (possibly collapsed) margin of its last in-flow child, if the child's bottom margin does not collapse with the element's bottom margin
// FIXME: 3. the bottom border edge of the last in-flow child whose top margin doesn't collapse with the element's bottom margin // FIXME: 3. the bottom border edge of the last in-flow child whose top margin doesn't collapse with the element's bottom margin
if (!box.children_are_inline()) { if (!box.children_are_inline()) {
Optional<float> top;
Optional<float> bottom; Optional<float> bottom;
box.for_each_child_of_type<Box>([&](Layout::Box& child_box) { box.for_each_child_of_type<Box>([&](Layout::Box& child_box) {
if (child_box.is_absolutely_positioned() || child_box.is_floating()) if (child_box.is_absolutely_positioned() || child_box.is_floating())
@ -232,15 +223,12 @@ float FormattingContext::compute_auto_height_for_block_level_element(FormattingS
// FIXME: Handle margin collapsing. // FIXME: Handle margin collapsing.
auto const& child_box_state = state.get(child_box); auto const& child_box_state = state.get(child_box);
float child_box_top = child_box_state.offset.y() - child_box_state.border_box_top();
float child_box_bottom = child_box_state.offset.y() + child_box_state.content_height + child_box_state.margin_box_bottom(); float child_box_bottom = child_box_state.offset.y() + child_box_state.content_height + child_box_state.margin_box_bottom();
if (!top.has_value() || child_box_top < top.value())
top = child_box_top;
if (!bottom.has_value() || child_box_bottom > bottom.value()) if (!bottom.has_value() || child_box_bottom > bottom.value())
bottom = child_box_bottom; bottom = child_box_bottom;
}); });
return bottom.value_or(0) - top.value_or(0); return bottom.value_or(0);
} }
// 4. zero, otherwise // 4. zero, otherwise
@ -259,16 +247,8 @@ float FormattingContext::compute_auto_height_for_block_formatting_context_root(F
// the top content edge and the bottom of the bottommost line box. // the top content edge and the bottom of the bottommost line box.
auto const& line_boxes = state.get(root).line_boxes; auto const& line_boxes = state.get(root).line_boxes;
top = 0; top = 0;
if (!line_boxes.is_empty()) { if (!line_boxes.is_empty())
// Find the top edge (if negative).
for (auto const& fragment : line_boxes.first().fragments()) {
float fragment_top_content_edge = fragment.offset().y();
if (!top.has_value() || fragment_top_content_edge < *top)
top = fragment_top_content_edge;
}
// Find the bottom edge.
bottom = line_boxes.last().bottom(); bottom = line_boxes.last().bottom();
}
} else { } else {
// If it has block-level children, the height is the distance between // If it has block-level children, the height is the distance between
// the top margin-edge of the topmost block-level child box // the top margin-edge of the topmost block-level child box