diff --git a/Tests/LibWeb/Layout/expected/table/auto-margins.txt b/Tests/LibWeb/Layout/expected/table/auto-margins.txt new file mode 100644 index 0000000000..d919c0e163 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/table/auto-margins.txt @@ -0,0 +1,12 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x33.46875 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x17.46875 children: not-inline + BlockContainer at (8,8) content-size 784x17.46875 children: not-inline + TableWrapper <(anonymous)> at (235.265625,8) content-size 329.46875x17.46875 [BFC] children: not-inline + TableBox at (235.265625,8) content-size 329.46875x17.46875 [TFC] children: not-inline + TableRowBox <(anonymous)> at (235.265625,8) content-size 329.46875x17.46875 children: not-inline + TableCellBox at (235.265625,8) content-size 329.46875x17.46875 [BFC] children: inline + line 0 width: 329.46875, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 34, rect: [235.265625,8 329.46875x17.46875] + "DaTa DisplaYiNg CSS WeBpaGE ScReEn" + TextNode <#text> diff --git a/Tests/LibWeb/Layout/expected/table/fixed-margins.txt b/Tests/LibWeb/Layout/expected/table/fixed-margins.txt new file mode 100644 index 0000000000..23747aaa3b --- /dev/null +++ b/Tests/LibWeb/Layout/expected/table/fixed-margins.txt @@ -0,0 +1,15 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x51.40625 [BFC] children: not-inline + BlockContainer at (8,8) content-size 784x35.40625 children: not-inline + BlockContainer at (8,8) content-size 784x35.40625 children: not-inline + TableWrapper <(anonymous)> at (108,8) content-size 584x35.40625 [BFC] children: not-inline + TableBox at (108,8) content-size 584x35.40625 [TFC] children: not-inline + TableRowBox <(anonymous)> at (108,8) content-size 584x35.40625 children: not-inline + TableCellBox at (108,8) content-size 584x35.40625 [BFC] children: inline + line 0 width: 569.859375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 58, rect: [108,8 569.859375x17.46875] + "DaTa DisplaYiNg CSS WeBpaGE ScReEn OF aR AddITioN COmmOnLY" + line 1 width: 399.9375, height: 17.9375, bottom: 35.40625, baseline: 13.53125 + frag 0 from TextNode start: 59, length: 40, rect: [108,25 399.9375x17.46875] + "To AdJuSt PRiCiNG sTYLiNG ceLL oF TAbLeS" + TextNode <#text> diff --git a/Tests/LibWeb/Layout/input/table/auto-margins.html b/Tests/LibWeb/Layout/input/table/auto-margins.html new file mode 100644 index 0000000000..ad2e96be46 --- /dev/null +++ b/Tests/LibWeb/Layout/input/table/auto-margins.html @@ -0,0 +1,22 @@ + +
DaTa DisplaYiNg CSS WeBpaGE ScReEn +
\ No newline at end of file diff --git a/Tests/LibWeb/Layout/input/table/fixed-margins.html b/Tests/LibWeb/Layout/input/table/fixed-margins.html new file mode 100644 index 0000000000..48b7d5a538 --- /dev/null +++ b/Tests/LibWeb/Layout/input/table/fixed-margins.html @@ -0,0 +1,22 @@ + +
DaTa DisplaYiNg CSS WeBpaGE ScReEn OF aR AddITioN COmmOnLY To AdJuSt PRiCiNG sTYLiNG ceLL oF TAbLeS +
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index 01ef8ed919..b4987315ed 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -342,12 +342,34 @@ CSSPixels BlockFormattingContext::compute_width_for_table_wrapper(Box const& box { // 17.5.2 // Table wrapper width should be equal to width of table box it contains + + auto const& computed_values = box.computed_values(); + + auto width_of_containing_block = available_space.width.to_px(); + auto width_of_containing_block_as_length_for_resolve = available_space.width.is_definite() ? CSS::Length::make_px(width_of_containing_block) : CSS::Length::make_px(0); + + auto zero_value = CSS::Length::make_px(0); + + auto margin_left = computed_values.margin().left().resolved(box, width_of_containing_block_as_length_for_resolve).resolved(box); + auto margin_right = computed_values.margin().right().resolved(box, width_of_containing_block_as_length_for_resolve).resolved(box); + + // If 'margin-left', or 'margin-right' are computed as 'auto', their used value is '0'. + if (margin_left.is_auto()) + margin_left = zero_value; + if (margin_right.is_auto()) + margin_right = zero_value; + + // table-wrapper can't have borders or paddings but it might have margin taken from table-root. + auto available_width = width_of_containing_block - margin_left.to_px(box) - margin_right.to_px(box); + LayoutState throwaway_state(&m_state); auto context = create_independent_formatting_context_if_needed(throwaway_state, box); VERIFY(context); context->run(box, LayoutMode::IntrinsicSizing, m_state.get(box).available_inner_space_or_constraints_from(available_space)); auto const* table_box = box.first_child_of_type(); - return throwaway_state.get(*table_box).content_width(); + + auto table_used_width = throwaway_state.get(*table_box).content_width(); + return table_used_width > available_width ? available_width : table_used_width; } void BlockFormattingContext::compute_height(Box const& box, AvailableSpace const& available_space)