diff options
| author | Andreas Kling <kling@serenityos.org> | 2023-06-04 12:55:55 +0200 |
|---|---|---|
| committer | Andreas Kling <kling@serenityos.org> | 2023-06-04 18:14:12 +0200 |
| commit | 89ba00304ce8c022b7cdd47be16759bf8dc008b4 (patch) | |
| tree | 39dbdd772d9389b2194147c617d5bc30e5c00f93 | |
| parent | 0e5ec8c0ab8594602fd226c9b96a64556417445b (diff) | |
| download | serenity-89ba00304ce8c022b7cdd47be16759bf8dc008b4.zip | |
LibWeb: Account for negative margins when calculating float intrusion
If a box has a negative margin-left, it may have a negative effective
offset within its parent BFC root coordinate system.
We can account for this when calculating the amount of left-side float
intrusion by flooring the X offset at 0.
4 files changed, 28 insertions, 2 deletions
diff --git a/Tests/LibWeb/Layout/expected/block-and-inline/block-with-negative-margin-and-no-intruding-floats.txt b/Tests/LibWeb/Layout/expected/block-and-inline/block-with-negative-margin-and-no-intruding-floats.txt new file mode 100644 index 0000000000..3477ef42f5 --- /dev/null +++ b/Tests/LibWeb/Layout/expected/block-and-inline/block-with-negative-margin-and-no-intruding-floats.txt @@ -0,0 +1,11 @@ +Viewport <#document> at (0,0) content-size 800x600 children: not-inline + BlockContainer <html> at (1,1) content-size 798x55.40625 [BFC] children: not-inline + BlockContainer <body> at (110,10) content-size 300x37.40625 positioned children: not-inline + BlockContainer <div> at (61,11) content-size 200x35.40625 children: inline + line 0 width: 159.859375, height: 17.46875, bottom: 17.46875, baseline: 13.53125 + frag 0 from TextNode start: 0, length: 19, rect: [61,11 159.859375x17.46875] + "there are no floats" + line 1 width: 163.875, height: 17.9375, bottom: 35.40625, baseline: 13.53125 + frag 0 from TextNode start: 20, length: 21, rect: [61,28 163.875x17.46875] + "intruding on this div" + TextNode <#text> diff --git a/Tests/LibWeb/Layout/input/block-and-inline/block-with-negative-margin-and-no-intruding-floats.html b/Tests/LibWeb/Layout/input/block-and-inline/block-with-negative-margin-and-no-intruding-floats.html new file mode 100644 index 0000000000..70f7052f7d --- /dev/null +++ b/Tests/LibWeb/Layout/input/block-and-inline/block-with-negative-margin-and-no-intruding-floats.html @@ -0,0 +1,15 @@ +<!doctype html><style> +* { border: 1px solid black; } +html { background: white; } +body { + position: relative; + left: 100px; + background: pink; + width: 300px; +} +div { + margin-left: -50px; + background: orange; + width: 200px; +} +</style><body><div>there are no floats intruding on this div diff --git a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp index 17961989c1..e362008da1 100644 --- a/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/BlockFormattingContext.cpp @@ -1066,7 +1066,7 @@ FormattingContext::SpaceUsedByFloats BlockFormattingContext::intrusion_by_floats CSSPixels y_in_root = box_in_root_rect.y() + y_in_box; auto space_used_by_floats_in_root = space_used_by_floats(y_in_root); - auto left_intrusion = max(CSSPixels(0), space_used_by_floats_in_root.left - box_in_root_rect.x()); + auto left_intrusion = max(CSSPixels(0), space_used_by_floats_in_root.left - max(CSSPixels(0), box_in_root_rect.x())); CSSPixels offset_from_containing_block_chain_margins_between_here_and_root = 0; for (auto const* containing_block = static_cast<Box const*>(&box); containing_block && containing_block != &root(); containing_block = containing_block->containing_block()) { diff --git a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp index 5284d433c0..3dd30d58f6 100644 --- a/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp +++ b/Userland/Libraries/LibWeb/Layout/InlineFormattingContext.cpp @@ -51,7 +51,7 @@ CSSPixels InlineFormattingContext::leftmost_x_offset_at(CSSPixels y) const } // The left edge of the containing block is to the left of the rightmost left-side float. // We adjust the inline content insertion point by the overlap between the containing block and the float. - return space.left - box_in_root_rect.x(); + return space.left - max(CSSPixels(0), box_in_root_rect.x()); } CSSPixels InlineFormattingContext::available_space_for_line(CSSPixels y) const |