diff --git a/Tests/LibWeb/Layout/expected/table/percentage-width-for-nested-table-is-like-auto.txt b/Tests/LibWeb/Layout/expected/table/percentage-width-for-nested-table-is-like-auto.txt new file mode 100644 index 0000000000..a03fef0134 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/table/percentage-width-for-nested-table-is-like-auto.txt @@ -0,0 +1,36 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x600 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x31.46875 children: not-inline + Box at (8,8) content-size 784x31.46875 [GFC] children: not-inline + BlockContainer
at (8,8) content-size 200x31.46875 [BFC] children: not-inline + TableWrapper <(anonymous)> at (8,8) content-size 200x31.46875 [BFC] children: not-inline + Box at (9,9) content-size 198x29.46875 table-box [TFC] children: not-inline + Box at (9,9) content-size 194x25.46875 table-row-group children: not-inline + Box at (11,11) content-size 194x25.46875 table-row children: not-inline + BlockContainer at (12,12) content-size 192x23.46875 table-cell [BFC] children: not-inline + TableWrapper <(anonymous)> at (12,12) content-size 192x23.46875 [BFC] children: not-inline + Box at (12,12) content-size 192x23.46875 table-box [TFC] children: not-inline + Box at (12,12) content-size 188x19.46875 table-row-group children: not-inline + Box at (14,14) content-size 188x19.46875 table-row children: not-inline + BlockContainer at (15,15) content-size 186x17.46875 table-cell [BFC] children: inline + line 0 width: 36.53125, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 3, rect: [15,15 36.53125x17.46875] + "A A" + TextNode <#text> + +PaintableWithLines (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x600] + PaintableWithLines (BlockContainer) [8,8 784x31.46875] + PaintableBox (Box
.grid_layout) [8,8 784x31.46875] + PaintableWithLines (BlockContainer
) [8,8 200x31.46875] + PaintableWithLines (TableWrapper(anonymous)) [8,8 200x31.46875] + PaintableBox (Box.outer) [8,8 200x31.46875] + PaintableBox (Box) [9,9 194x25.46875] overflow: [9,9 196x27.46875] + PaintableBox (Box) [11,11 194x25.46875] + PaintableWithLines (BlockContainer
) [11,11 194x25.46875] + PaintableWithLines (TableWrapper(anonymous)) [12,12 192x23.46875] + PaintableBox (Box.inner) [12,12 192x23.46875] + PaintableBox (Box) [12,12 188x19.46875] overflow: [12,12 190x21.46875] + PaintableBox (Box) [14,14 188x19.46875] + PaintableWithLines (BlockContainer
) [14,14 188x19.46875] + TextPaintable (TextNode<#text>) diff --git a/Tests/LibWeb/Layout/input/table/percentage-width-for-nested-table-is-like-auto.html b/Tests/LibWeb/Layout/input/table/percentage-width-for-nested-table-is-like-auto.html new file mode 100644 index 0000000000..3db36d6b81 --- /dev/null +++ b/Tests/LibWeb/Layout/input/table/percentage-width-for-nested-table-is-like-auto.html @@ -0,0 +1,15 @@ +
A A
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/TableFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/TableFormattingContext.cpp index a4115cc9d9..a5c5098f96 100644 --- a/Userland/Libraries/LibWeb/Layout/TableFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/TableFormattingContext.cpp @@ -559,6 +559,11 @@ CSSPixels TableFormattingContext::compute_capmin() return capmin; } +static bool width_is_auto_relative_to_state(CSS::Size const& width, LayoutState::UsedValues const& state) +{ + return width.is_auto() || (width.contains_percentage() && !state.has_definite_width()); +} + void TableFormattingContext::compute_table_width() { // https://drafts.csswg.org/css-tables-3/#computing-the-table-width @@ -571,7 +576,8 @@ void TableFormattingContext::compute_table_width() // Percentages on 'width' and 'height' on the table are relative to the table wrapper box's containing block, // not the table wrapper box itself. - CSSPixels width_of_table_wrapper_containing_block = m_state.get(*table_wrapper().containing_block()).content_width(); + auto const& containing_block_state = m_state.get(*table_wrapper().containing_block()); + CSSPixels width_of_table_wrapper_containing_block = containing_block_state.content_width(); // Compute undistributable space due to border spacing: https://www.w3.org/TR/css-tables-3/#computing-undistributable-space. auto undistributable_space = (m_columns.size() + 1) * border_spacing_horizontal(); @@ -599,7 +605,7 @@ void TableFormattingContext::compute_table_width() } CSSPixels used_width; - if (computed_values.width().is_auto()) { + if (width_is_auto_relative_to_state(computed_values.width(), containing_block_state)) { // If the table-root has 'width: auto', the used width is the greater of // min(GRIDMAX, the table’s containing block width), the used min-width of the table. if (width_of_table_containing_block.is_definite())