LibWeb: Ignore negative margins for margin box rect

Negative margins are processed through the `offset` in layout state, and
should not contribute to the margin box' rect's size or position.

Fixes #4249.
This commit is contained in:
Jelle Raaijmakers 2025-04-10 13:36:15 +02:00
parent 96219d60e1
commit f617d06adf
3 changed files with 30 additions and 4 deletions

View file

@ -1828,12 +1828,12 @@ CSSPixels FormattingContext::box_baseline(Box const& box) const
{
return {
{
-used_values.margin_box_left(),
-used_values.margin_box_top(),
-max(used_values.margin_box_left(), 0),
-max(used_values.margin_box_top(), 0),
},
{
used_values.margin_box_left() + used_values.content_width() + used_values.margin_box_right(),
used_values.margin_box_top() + used_values.content_height() + used_values.margin_box_bottom(),
max(used_values.margin_box_left(), 0) + used_values.content_width() + max(used_values.margin_box_right(), 0),
max(used_values.margin_box_top(), 0) + used_values.content_height() + max(used_values.margin_box_bottom(), 0),
},
};
}

View file

@ -0,0 +1,13 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x48 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x0 children: inline
BlockContainer <div.r> at (8,-2) content-size 50x50 floating [BFC] children: not-inline
TextNode <#text>
BlockContainer <div.g> at (58,-2) content-size 50x50 floating [BFC] children: not-inline
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x48]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x0]
PaintableWithLines (BlockContainer<DIV>.r) [8,-2 50x50]
PaintableWithLines (BlockContainer<DIV>.g) [58,-2 50x50]

View file

@ -0,0 +1,13 @@
<!DOCTYPE html>
<style>
div {
margin-top: -10px;
width: 50px;
height: 50px;
float: left;
}
.r { background: red; }
.g { background: green; }
</style>
<div class="r"></div>
<div class="g"></div>