LibWeb: Subtract left inset from size_available_for_margins for abspos

Fixes https://github.com/LadybirdBrowser/ladybird/issues/712
This commit is contained in:
Aliaksandr Kalenik 2024-07-19 13:58:59 +02:00 committed by Sam Atkins
commit 0be57df54d
Notes: sideshowbarker 2024-07-19 21:35:25 +09:00
3 changed files with 34 additions and 1 deletions

View file

@ -0,0 +1,15 @@
Viewport <#document> at (0,0) content-size 800x600 children: not-inline
BlockContainer <html> at (0,0) content-size 800x418 [BFC] children: not-inline
BlockContainer <body> at (8,8) content-size 784x402 children: not-inline
BlockContainer <div.features-list> at (9,9) content-size 400x400 positioned children: not-inline
BlockContainer <div.feature> at (109,10) content-size 200x200 positioned [BFC] children: inline
frag 0 from TextNode start: 0, length: 11, rect: [109,10 102.625x17] baseline: 13.296875
"Autocorrect"
TextNode <#text>
ViewportPaintable (Viewport<#document>) [0,0 800x600]
PaintableWithLines (BlockContainer<HTML>) [0,0 800x418]
PaintableWithLines (BlockContainer<BODY>) [8,8 784x402]
PaintableWithLines (BlockContainer<DIV>.features-list) [8,8 402x402]
PaintableWithLines (BlockContainer<DIV>.feature) [108,9 202x202]
TextPaintable (TextNode<#text>)

View file

@ -0,0 +1,18 @@
<!DOCTYPE html><style>
.features-list {
position: relative;
width: 400px;
height: 400px;
border: 1px solid red;
}
.feature {
position: absolute;
margin: auto;
border: 1px solid black;
left: 100px;
right: 100px;
width: 200px;
height: 200px;
}
</style><div class="features-list"><div class="feature">Autocorrect</div></div>

View file

@ -726,7 +726,7 @@ void FormattingContext::compute_width_for_absolutely_positioned_non_replaced_ele
// If both margin-left and margin-right are auto, // If both margin-left and margin-right are auto,
// solve the equation under the extra constraint that the two margins get equal values // solve the equation under the extra constraint that the two margins get equal values
// FIXME: unless this would make them negative, in which case when direction of the containing block is ltr (rtl), set margin-left (margin-right) to 0 and solve for margin-right (margin-left). // FIXME: unless this would make them negative, in which case when direction of the containing block is ltr (rtl), set margin-left (margin-right) to 0 and solve for margin-right (margin-left).
auto size_available_for_margins = width_of_containing_block - border_left - padding_left - width.to_px(box) - padding_right - border_right - right; auto size_available_for_margins = width_of_containing_block - border_left - padding_left - width.to_px(box) - padding_right - border_right - left - right;
if (margin_left.is_auto() && margin_right.is_auto()) { if (margin_left.is_auto() && margin_right.is_auto()) {
margin_left = CSS::Length::make_px(size_available_for_margins / 2); margin_left = CSS::Length::make_px(size_available_for_margins / 2);
margin_right = CSS::Length::make_px(size_available_for_margins / 2); margin_right = CSS::Length::make_px(size_available_for_margins / 2);