LibWeb/Layout: Fix min{max}-content size calculation for grid items

Instead of directly invoking `to_px()`,
`calculate_min_content_contribution()` needs to use
`calculate_inner_width()` and `calculate_inner_height()`, which are
aware of how to correctly handle `min-content` and `max-content` values.

Fixes https://github.com/LadybirdBrowser/ladybird/issues/3469
This commit is contained in:
Aliaksandr Kalenik 2025-03-14 21:50:37 +01:00 committed by Alexander Kalenik
parent 08c155cd3f
commit 23151de217
Notes: github-actions[bot] 2025-03-15 12:52:10 +00:00
3 changed files with 37 additions and 5 deletions

View file

@ -2438,12 +2438,12 @@ CSSPixels GridFormattingContext::calculate_min_content_contribution(GridItem con
}
auto preferred_size = get_item_preferred_size(item, dimension);
if (dimension == GridDimension::Row && preferred_size.is_auto() && item.box->has_preferred_aspect_ratio()) {
return m_state.get(item.box).content_width() / item.box->preferred_aspect_ratio().value();
if (dimension == GridDimension::Column) {
auto width = calculate_inner_width(item.box, m_available_space->width, preferred_size);
return min(item.add_margin_box_sizes(width, dimension), maxium_size);
}
auto containing_block_size = containing_block_size_for_item(item, dimension);
auto result = item.add_margin_box_sizes(preferred_size.to_px(grid_container(), containing_block_size), dimension);
return min(result, maxium_size);
auto height = calculate_inner_height(item.box, *m_available_space, preferred_size);
return min(item.add_margin_box_sizes(height, dimension), maxium_size);
}
CSSPixels GridFormattingContext::calculate_max_content_contribution(GridItem const& item, GridDimension const dimension) const

View file

@ -0,0 +1,15 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x33 [BFC] children: not-inline
Box <body> at (8,8) content-size 784x17 [GFC] children: not-inline
Box <div.main> at (8,8) content-size 100x17 flex-container(row) [FFC] children: not-inline
BlockContainer <div.player> at (8,8) content-size 100x17 flex-item [BFC] children: inline
frag 0 from TextNode start: 0, length: 3, rect: [8,8 26.953125x17] baseline: 13.296875
"whf"
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x33]
PaintableBox (Box<BODY>) [8,8 784x17]
PaintableBox (Box<DIV>.main) [8,8 100x17]
PaintableWithLines (BlockContainer<DIV>.player) [8,8 100x17]
TextPaintable (TextNode<#text>)

View file

@ -0,0 +1,17 @@
<!doctype html><style>
* {
outline: 1px solid black;
}
body {
display: grid;
grid-template-columns: min-content;
}
.main {
display: flex;
margin: 0px auto;
width: min-content;
}
.player {
width: 100px;
}
</style><body><div class="main"><div class="player">whf