at (194.984375,23) content-size 290x170 [BFC] children: inline
- frag 0 from TextNode start: 1, length: 34, rect: [194.984375,23 278.625x17] baseline: 13.296875
+ BlockContainer
at (270.234375,23) content-size 290x170 [BFC] children: inline
+ frag 0 from TextNode start: 1, length: 34, rect: [270.234375,23 278.625x17] baseline: 13.296875
"Item with more text in it. Because"
- frag 1 from TextNode start: 36, length: 33, rect: [194.984375,40 274.53125x17] baseline: 13.296875
+ frag 1 from TextNode start: 36, length: 33, rect: [270.234375,40 274.53125x17] baseline: 13.296875
"the contents of it are wider than"
- frag 2 from TextNode start: 70, length: 35, rect: [194.984375,57 289.90625x17] baseline: 13.296875
+ frag 2 from TextNode start: 70, length: 35, rect: [270.234375,57 289.90625x17] baseline: 13.296875
"the maximum width, it is clamped at"
- frag 3 from TextNode start: 106, length: 11, rect: [194.984375,74 86.609375x17] baseline: 13.296875
+ frag 3 from TextNode start: 106, length: 11, rect: [270.234375,74 86.609375x17] baseline: 13.296875
"300 pixels."
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
TextNode <#text>
- BlockContainer
at (499.984375,23) content-size 277.015625x170 [BFC] children: inline
- frag 0 from TextNode start: 0, length: 13, rect: [499.984375,23 102.53125x17] baseline: 13.296875
+ BlockContainer
at (575.234375,23) content-size 201.765625x170 [BFC] children: inline
+ frag 0 from TextNode start: 0, length: 13, rect: [575.234375,23 102.53125x17] baseline: 13.296875
"Flexible item"
TextNode <#text>
BlockContainer <(anonymous)> (not painted) [BFC] children: inline
@@ -37,10 +35,10 @@ ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer) [0,0 800x600]
PaintableWithLines (BlockContainer) [8,8 784x200]
PaintableBox (Box
#container) [8,8 784x200]
- PaintableWithLines (BlockContainer
) [18,18 166.984375x180]
+ PaintableWithLines (BlockContainer
) [18,18 242.234375x180]
TextPaintable (TextNode<#text>)
- PaintableWithLines (BlockContainer
) [189.984375,18 300x180]
+ PaintableWithLines (BlockContainer
) [265.234375,18 300x180]
TextPaintable (TextNode<#text>)
- PaintableWithLines (BlockContainer
) [494.984375,18 287.015625x180]
+ PaintableWithLines (BlockContainer
) [570.234375,18 211.765625x180]
TextPaintable (TextNode<#text>)
- PaintableWithLines (BlockContainer(anonymous)) [8,208 784x0]
\ No newline at end of file
+ PaintableWithLines (BlockContainer(anonymous)) [8,208 784x0]
diff --git a/Tests/LibWeb/Layout/expected/grid/fit-content-3.txt b/Tests/LibWeb/Layout/expected/grid/fit-content-3.txt
new file mode 100644
index 00000000000..23490518119
--- /dev/null
+++ b/Tests/LibWeb/Layout/expected/grid/fit-content-3.txt
@@ -0,0 +1,31 @@
+Viewport <#document> at (0,0) content-size 800x600 children: not-inline
+ BlockContainer at (0,0) content-size 800x120 [BFC] children: not-inline
+ BlockContainer at (8,10) content-size 784x104 children: not-inline
+ BlockContainer
at (8,10) content-size 200x104 children: inline
+ frag 0 from Box start: 0, length: 0, rect: [8,10 104x104] baseline: 104
+ TextNode <#text>
+ Box at (8,10) content-size 104x104 [GFC] children: not-inline
+ BlockContainer <(anonymous)> at (8,10) content-size 0x0 [BFC] children: inline
+ TextNode <#text>
+ BlockContainer at (8,10) content-size 78x104 [BFC] children: not-inline
+ BlockContainer <(anonymous)> at (9,11) content-size 50x50 floating [BFC] children: inline
+ TextNode <#text>
+ BlockContainer <(anonymous)> at (9,63) content-size 50x50 floating [BFC] children: inline
+ TextNode <#text>
+ BlockContainer <(anonymous)> at (8,10) content-size 0x0 [BFC] children: inline
+ TextNode <#text>
+ TextNode <#text>
+ BlockContainer <(anonymous)> at (8,114) content-size 784x0 children: inline
+ TextNode <#text>
+
+ViewportPaintable (Viewport<#document>) [0,0 800x600]
+ PaintableWithLines (BlockContainer) [0,0 800x120]
+ PaintableWithLines (BlockContainer) [8,10 784x104]
+ PaintableWithLines (BlockContainer.container) [8,10 200x104]
+ PaintableBox (Box
.grid) [8,10 104x104]
+ PaintableWithLines (BlockContainer(anonymous)) [8,10 0x0]
+ PaintableWithLines (BlockContainer
.item) [8,10 78x104]
+ PaintableWithLines (BlockContainer(anonymous)) [8,10 52x52]
+ PaintableWithLines (BlockContainer(anonymous)) [8,62 52x52]
+ PaintableWithLines (BlockContainer(anonymous)) [8,10 0x0]
+ PaintableWithLines (BlockContainer(anonymous)) [8,114 784x0]
diff --git a/Tests/LibWeb/Layout/input/grid/fit-content-3.html b/Tests/LibWeb/Layout/input/grid/fit-content-3.html
new file mode 100644
index 00000000000..a34568da8ec
--- /dev/null
+++ b/Tests/LibWeb/Layout/input/grid/fit-content-3.html
@@ -0,0 +1,27 @@
+
+
+
diff --git a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp
index 3122cd7bb09..b55efa2ef4f 100644
--- a/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp
+++ b/Userland/Libraries/LibWeb/Layout/GridFormattingContext.cpp
@@ -867,10 +867,14 @@ void GridFormattingContext::increase_sizes_to_accommodate_spanning_items_crossin
});
for (auto& track : spanned_tracks) {
if (track.max_track_sizing_function.is_fit_content()) {
- track.growth_limit = css_clamp(
- track.planned_increase,
- track.base_size,
- track.max_track_sizing_function.css_size().to_px(grid_container(), available_size.to_px_or_zero()));
+ track.growth_limit.value() += track.planned_increase;
+ if (track.growth_limit.value() < track.base_size)
+ track.growth_limit = track.base_size;
+ if (available_size.is_definite()) {
+ auto fit_content_limit = track.max_track_sizing_function.css_size().to_px(grid_container(), available_size.to_px_or_zero());
+ if (track.growth_limit.value() > fit_content_limit)
+ track.growth_limit = fit_content_limit;
+ }
} else if (!track.growth_limit.has_value()) {
// If the affected size is an infinite growth limit, set it to the track’s base size plus the planned increase.
track.growth_limit = track.base_size + track.planned_increase;