Stowage/ladybird
2
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2026-04-18 18:00:31 +00:00
Code Issues Projects Releases Packages Wiki Activity

LibWeb: Use list item's line-height to provide space for marker

Browse source 
Empty list items should still have a default height if a marker is
present.

Fixes #3762.
This commit is contained in:
Jelle Raaijmakers 2026-01-26 12:26:29 +01:00 • committed by Jelle Raaijmakers
parent 19882e1ed6
commit 01518ba6a6
Notes: github-actions[bot] 2026-02-06 11:05:56 +00:00
5 changed files with 64 additions and 28 deletions
Download patch file Download diff file Expand all files Collapse all files

15
Libraries/LibWeb/Layout/BlockFormattingContext.cpp
View file

@ -658,15 +658,18 @@ CSSPixels BlockFormattingContext::compute_auto_height_for_block_level_element(Bo
// 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
// 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()) {
CSSPixels marker_line_height = 0;
for (auto* child_box = box.last_child_of_type<Box>(); child_box; child_box = child_box->previous_sibling_of_type<Box>()) {
if (child_box->is_absolutely_positioned() || child_box->is_floating())
continue;
// FIXME: This is hack. If the last child is a list-item marker box, we ignore it for purposes of height calculation.
// Perhaps markers should not be considered in-flow(?) Perhaps they should always be the first child of the list-item
// box instead of the last child.
if (child_box->is_list_item_marker_box())
// NOTE: Markers are not in-flow, but for list items that contain only floats (or are otherwise empty),
// the marker's line-height determines the list item's height. This ensures proper vertical stacking
// of list items and alignment with their floated content.
if (child_box->is_list_item_marker_box()) {
marker_line_height = child_box->computed_values().line_height();
continue;
}
auto const& child_box_state = m_state.get(*child_box);
@ -681,6 +684,10 @@ CSSPixels BlockFormattingContext::compute_auto_height_for_block_level_element(Bo
return max(CSSPixels(0), child_box_state.offset.y() + child_box_state.content_height() + child_box_state.border_box_bottom() + margin_bottom);
}
// If no in-flow children were found but there's a marker, use the marker's line-height.
if (marker_line_height > 0)
return marker_line_height;
}
// 4. zero, otherwise

27
Tests/LibWeb/Layout/expected/empty-list-items.txt Normal file
View file

@ -0,0 +1,27 @@
Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] [BFC] children: not-inline
BlockContainer <html> at [0,0] [0+0+0 800 0+0+0] [0+0+0 86 0+0+0] [BFC] children: not-inline
BlockContainer <body> at [8,16] [8+0+0 784 0+0+8] [8+0+0 54 0+0+16] children: not-inline
BlockContainer <ol> at [48,16] [0+0+40 744 0+0+0] [16+0+0 54 0+0+16] children: not-inline
ListItemBox <li> at [48,16] [0+0+0 744 0+0+0] [0+0+0 18 0+0+0] children: not-inline
ListItemMarkerBox <(anonymous)> at [29,17] [0+0+0 18.6875 0+0+0] [0+0+0 16 0+0+0] children: not-inline
ListItemBox <li> at [48,34] [0+0+0 744 0+0+0] [0+0+0 18 0+0+0] children: not-inline
ListItemMarkerBox <(anonymous)> at [27,35] [0+0+0 21.15625 0+0+0] [0+0+0 16 0+0+0] children: not-inline
ListItemBox <li> at [48,52] [0+0+0 744 0+0+0] [0+0+0 18 0+0+0] children: not-inline
ListItemMarkerBox <(anonymous)> at [27,53] [0+0+0 21.4375 0+0+0] [0+0+0 16 0+0+0] children: not-inline
BlockContainer <(anonymous)> at [8,86] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x86]
PaintableWithLines (BlockContainer<BODY>) [8,16 784x54]
PaintableWithLines (BlockContainer<OL>) [8,16 784x54]
PaintableWithLines (ListItemBox<LI>) [48,16 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [29,17 18.6875x16]
PaintableWithLines (ListItemBox<LI>) [48,34 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [27,35 21.15625x16]
PaintableWithLines (ListItemBox<LI>) [48,52 744x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [27,53 21.4375x16]
PaintableWithLines (BlockContainer(anonymous)) [8,86 784x0]
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x86] [children: 0] (z-index: auto)

18
Tests/LibWeb/Layout/expected/inside-list-item-content-offset.txt
View file

@ -1,17 +1,17 @@
Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] [BFC] children: not-inline
BlockContainer <html> at [0,0] [0+0+0 800 0+0+0] [0+0+0 406 0+0+0] [BFC] children: not-inline
BlockContainer <body> at [8,200] [8+0+0 784 0+0+8] [8+0+0 6 0+0+200] children: not-inline
ListItemBox <span> at [222,200] [200+0+0 378 0+0+200] [200+0+0 6 0+0+200] children: not-inline
BlockContainer <html> at [0,0] [0+0+0 800 0+0+0] [0+0+0 418 0+0+0] [BFC] children: not-inline
BlockContainer <body> at [8,200] [8+0+0 784 0+0+8] [8+0+0 18 0+0+200] children: not-inline
ListItemBox <span> at [222,200] [200+0+0 378 0+0+200] [200+0+0 18 0+0+200] children: not-inline
ListItemMarkerBox <(anonymous)> at [208,206] [0+0+0 6 0+0+0] [0+0+0 6 0+0+0] children: not-inline
BlockContainer <(anonymous)> at [8,200] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
BlockContainer <(anonymous)> at [8,418] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x406]
PaintableWithLines (BlockContainer<BODY>) [8,200 784x6] overflow: [8,200 784x12]
PaintableWithLines (ListItemBox<SPAN>) [222,200 378x6] overflow: [222,200 378x12]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x418]
PaintableWithLines (BlockContainer<BODY>) [8,200 784x18]
PaintableWithLines (ListItemBox<SPAN>) [222,200 378x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [208,206 6x6]
PaintableWithLines (BlockContainer(anonymous)) [8,200 784x0]
PaintableWithLines (BlockContainer(anonymous)) [8,418 784x0]
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x406] [children: 0] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x418] [children: 0] (z-index: auto)

30
Tests/LibWeb/Layout/expected/list-item-with-floated-child.txt
View file

@ -1,36 +1,36 @@
Viewport <#document> at [0,0] [0+0+0 800 0+0+0] [0+0+0 600 0+0+0] [BFC] children: not-inline
BlockContainer <html> at [0,0] [0+0+0 800 0+0+0] [0+0+0 44 0+0+0] [BFC] children: not-inline
BlockContainer <body> at [8,8] [8+0+0 784 0+0+8] [8+0+0 6 0+0+8] children: not-inline
ListItemBox <li> at [8,8] [0+0+0 784 0+0+0] [0+0+0 6 0+0+0] children: not-inline
BlockContainer <html> at [0,0] [0+0+0 800 0+0+0] [0+0+0 52 0+0+0] [BFC] children: not-inline
BlockContainer <body> at [8,8] [8+0+0 784 0+0+8] [8+0+0 36 0+0+8] children: not-inline
ListItemBox <li> at [8,8] [0+0+0 784 0+0+0] [0+0+0 18 0+0+0] children: not-inline
ListItemMarkerBox <(anonymous)> at [-6,14] [0+0+0 6 0+0+0] [0+0+0 6 0+0+0] children: not-inline
BlockContainer <a> at [8,8] floating [0+0+0 784 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,8 14.265625x18] baseline: 13.796875
"A"
TextNode <#text> (not painted)
BlockContainer <(anonymous)> at [8,8] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
BlockContainer <(anonymous)> at [8,26] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
ListItemBox <li> at [8,8] [0+0+0 784 0+0+0] [0+0+0 6 0+0+0] children: not-inline
ListItemMarkerBox <(anonymous)> at [-6,14] [0+0+0 6 0+0+0] [0+0+0 6 0+0+0] children: not-inline
ListItemBox <li> at [8,26] [0+0+0 784 0+0+0] [0+0+0 18 0+0+0] children: not-inline
ListItemMarkerBox <(anonymous)> at [-6,32] [0+0+0 6 0+0+0] [0+0+0 6 0+0+0] children: not-inline
BlockContainer <a> at [8,26] floating [0+0+0 784 0+0+0] [0+0+0 18 0+0+0] [BFC] children: inline
frag 0 from TextNode start: 0, length: 1, rect: [8,26 9.34375x18] baseline: 13.796875
"B"
TextNode <#text> (not painted)
BlockContainer <(anonymous)> at [8,8] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
BlockContainer <(anonymous)> at [8,44] [0+0+0 784 0+0+0] [0+0+0 0 0+0+0] children: inline
TextNode <#text> (not painted)
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x44]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x6] overflow: [8,8 784x36]
PaintableWithLines (ListItemBox<LI>) [8,8 784x6] overflow: [8,8 784x18]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x52]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x36]
PaintableWithLines (ListItemBox<LI>) [8,8 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-6,14 6x6]
PaintableWithLines (BlockContainer<A>) [8,8 784x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
PaintableWithLines (ListItemBox<LI>) [8,8 784x6] overflow: [8,8 784x36]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-6,14 6x6]
PaintableWithLines (BlockContainer(anonymous)) [8,26 784x0]
PaintableWithLines (ListItemBox<LI>) [8,26 784x18]
MarkerPaintable (ListItemMarkerBox(anonymous)) [-6,32 6x6]
PaintableWithLines (BlockContainer<A>) [8,26 784x18]
TextPaintable (TextNode<#text>)
PaintableWithLines (BlockContainer(anonymous)) [8,8 784x0]
PaintableWithLines (BlockContainer(anonymous)) [8,44 784x0]
SC for Viewport<#document> [0,0 800x600] [children: 1] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x44] [children: 0] (z-index: auto)
SC for BlockContainer<HTML> [0,0 800x52] [children: 0] (z-index: auto)

2
Tests/LibWeb/Layout/input/empty-list-items.html Normal file
View file

@ -0,0 +1,2 @@
<!DOCTYPE html>
<ol><li></li><li></li><li></li></ol>