LibWeb: Use grid area as available size for abspos contained in GFC

Fixes incorrect percentage length resolution for abspos boxes contained
by a grid.
This commit is contained in:
Aliaksandr Kalenik 2024-09-12 18:02:58 +02:00 committed by Alexander Kalenik
parent 1d9c404b8c
commit a64d182583
Notes: github-actions[bot] 2024-09-12 19:08:37 +00:00
4 changed files with 41 additions and 8 deletions

View file

@ -0,0 +1,11 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (1,1) content-size 798x120 [BFC] children: not-inline
BlockContainer <body> at (10,10) content-size 780x102 children: not-inline
Box <div.grid> at (11,11) content-size 200x100 positioned [GFC] children: not-inline
BlockContainer <div.abspos-item> at (112,12) content-size 50x50 positioned [BFC] children: not-inline
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x122]
PaintableWithLines (BlockContainer<BODY>) [9,9 782x104]
PaintableBox (Box<DIV>.grid) [10,10 202x102]
PaintableWithLines (BlockContainer<DIV>.abspos-item) [111,11 52x52]

View file

@ -0,0 +1,23 @@
<!DOCTYPE html><style>
* {
border: 1px solid black;
}
.grid {
display: grid;
grid-template-columns: 100px 100px;
grid-template-areas: "a b";
position: relative;
width: 200px;
height: 100px;
}
.abspos-item {
position: absolute;
top: 0;
left: 0;
width: 50%;
height: 50%;
grid-area: b;
}
</style><div class="grid"><div class="abspos-item"></div></div>

View file

@ -1897,7 +1897,7 @@ void GridFormattingContext::run(AvailableSpace const& available_space)
m_state.get_mutable(grid_container()).set_grid_template_rows(CSS::GridTrackSizeListStyleValue::create(move(grid_track_rows)));
}
void GridFormattingContext::layout_absolutely_positioned_element(Box const& box, AvailableSpace const& available_space)
void GridFormattingContext::layout_absolutely_positioned_element(Box const& box)
{
auto& containing_block_state = m_state.get_mutable(*box.containing_block());
auto& box_state = m_state.get_mutable(box);
@ -1913,6 +1913,8 @@ void GridFormattingContext::layout_absolutely_positioned_element(Box const& box,
GridItem item { box, row_start, row_span, column_start, column_span };
auto available_space = get_available_space_for_item(item);
// The border computed values are not changed by the compute_height & width calculations below.
// The spec only adjusts and computes sizes, insets and margins.
box_state.border_left = box.computed_values().border_left().width;
@ -2015,12 +2017,9 @@ void GridFormattingContext::parent_context_did_dimension_child_root_box()
return IterationDecision::Continue;
});
for (auto& child : grid_container().contained_abspos_children()) {
auto& box = verify_cast<Box>(*child);
auto& cb_state = m_state.get(*box.containing_block());
auto available_width = AvailableSize::make_definite(cb_state.content_width() + cb_state.padding_left + cb_state.padding_right);
auto available_height = AvailableSize::make_definite(cb_state.content_height() + cb_state.padding_top + cb_state.padding_bottom);
layout_absolutely_positioned_element(box, AvailableSpace(available_width, available_height));
for (auto const& child : grid_container().contained_abspos_children()) {
auto const& box = verify_cast<Box>(*child);
layout_absolutely_positioned_element(box);
}
}

View file

@ -238,7 +238,7 @@ private:
void determine_grid_container_height();
void determine_intrinsic_size_of_grid_container(AvailableSpace const& available_space);
void layout_absolutely_positioned_element(Box const&, AvailableSpace const&);
void layout_absolutely_positioned_element(Box const&);
virtual void parent_context_did_dimension_child_root_box() override;
void resolve_grid_item_widths();