mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-04-21 03:55:24 +00:00
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:
parent
96219d60e1
commit
f617d06adf
3 changed files with 30 additions and 4 deletions
|
@ -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),
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -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]
|
|
@ -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>
|
Loading…
Add table
Reference in a new issue