From 7abb182fa33999915bf71bc55d3885d4e92ebf95 Mon Sep 17 00:00:00 2001 From: Andreas Kling Date: Sun, 10 Dec 2023 10:09:38 +0100 Subject: [PATCH] LibWeb: Honor negative margins on atomic inlines Sizing already worked correctly, but before this change, we were too aggressive with inserting line breaks when negative margins would still an atomic inline to fit on the line. --- ...inline-block-with-negative-margin-left.txt | 14 +++++++++++ ...nline-block-with-negative-margin-right.txt | 14 +++++++++++ ...nline-block-with-negative-margin-left.html | 23 +++++++++++++++++++ ...line-block-with-negative-margin-right.html | 23 +++++++++++++++++++ .../LibWeb/Layout/InlineFormattingContext.cpp | 7 +++++- 5 files changed, 80 insertions(+), 1 deletion(-) create mode 100644 Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-left.txt create mode 100644 Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-right.txt create mode 100644 Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-left.html create mode 100644 Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-right.html diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-left.txt b/Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-left.txt new file mode 100644 index 0000000000..896ab407e4 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-left.txt @@ -0,0 +1,14 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x60 [BFC] children: not-inline + BlockContainer at (5,5) content-size 150x50 children: inline + line 0 width: 150, height: 50, bottom: 50, baseline: 50 + frag 0 from BlockContainer start: 0, length: 0, rect: [5,5 100x50] + frag 1 from BlockContainer start: 0, length: 0, rect: [55,5 100x50] + BlockContainer at (5,5) content-size 100x50 inline-block [BFC] children: not-inline + BlockContainer at (55,5) content-size 100x50 inline-block [BFC] children: not-inline + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x60] + PaintableWithLines (BlockContainer) [0,0 160x60] + PaintableWithLines (BlockContainer
.foo) [5,5 100x50] + PaintableWithLines (BlockContainer
.bar) [55,5 100x50] diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-right.txt b/Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-right.txt new file mode 100644 index 0000000000..abb00e92be --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/inline-block-with-negative-margin-right.txt @@ -0,0 +1,14 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer at (0,0) content-size 800x60 [BFC] children: not-inline + BlockContainer at (5,5) content-size 150x50 children: inline + line 0 width: 150, height: 50, bottom: 50, baseline: 50 + frag 0 from BlockContainer start: 0, length: 0, rect: [5,5 100x50] + frag 1 from BlockContainer start: 0, length: 0, rect: [105,5 100x50] + BlockContainer at (5,5) content-size 100x50 inline-block [BFC] children: not-inline + BlockContainer at (105,5) content-size 100x50 inline-block [BFC] children: not-inline + +ViewportPaintable (Viewport<#document>) [0,0 800x600] + PaintableWithLines (BlockContainer) [0,0 800x60] + PaintableWithLines (BlockContainer) [0,0 160x60] overflow: [5,5 200x50] + PaintableWithLines (BlockContainer
.foo) [5,5 100x50] + PaintableWithLines (BlockContainer
.bar) [105,5 100x50] diff --git a/Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-left.html b/Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-left.html new file mode 100644 index 0000000000..f4d5e1bda9 --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-left.html @@ -0,0 +1,23 @@ +
\ No newline at end of file diff --git a/Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-right.html b/Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-right.html new file mode 100644 index 0000000000..b02d3caab2 --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/inline-block-with-negative-margin-right.html @@ -0,0 +1,23 @@ +
\ No newline at end of file diff --git a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp index 98c2584a89..127f212934 100644 --- a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp @@ -275,7 +275,12 @@ void InlineFormattingContext::generate_line_boxes(LayoutMode layout_mode) auto& box = verify_cast(*item.node); compute_inset(box); if (containing_block().computed_values().white_space() != CSS::WhiteSpace::Nowrap) { - line_builder.break_if_needed(item.border_box_width()); + auto minimum_space_needed_on_line = item.border_box_width(); + if (item.margin_start < 0) + minimum_space_needed_on_line += item.margin_start; + if (item.margin_end < 0) + minimum_space_needed_on_line += item.margin_end; + line_builder.break_if_needed(minimum_space_needed_on_line); } line_builder.append_box(box, item.border_start + item.padding_start, item.padding_end + item.border_end, item.margin_start, item.margin_end); break;