0

Need to include non-auto margins when resolving auto margins.

Make sure that an auto margin doesn't receive the space actually taken
up by the non-auto margin on the other side of the box. Didn't get this
right for @page auto margins.

Bug: 40286153
Change-Id: Iff877c6f0ad9ecee594f51ef7b4ca5f71eb3be26
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5573406
Commit-Queue: Morten Stenshorne <mstensho@chromium.org>
Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1307087}
This commit is contained in:
Morten Stenshorne
2024-05-28 22:36:04 +00:00
committed by Chromium LUCI CQ
parent eb3c2d8fb9
commit 6e4d4b8fba
4 changed files with 99 additions and 2 deletions

@@ -166,12 +166,14 @@ void ResolvePageBoxGeometry(const BlockNode& page_box,
}
};
LayoutUnit additional_inline_space =
space.AvailableSize().inline_size - geometry->border_box_size.inline_size;
space.AvailableSize().inline_size -
(geometry->border_box_size.inline_size + margins->InlineSum());
ResolveAutoMargin(style.MarginInlineStartUsing(style),
style.MarginInlineEndUsing(style), additional_inline_space,
&margins->inline_start, &margins->inline_end);
LayoutUnit additional_block_space =
space.AvailableSize().block_size - geometry->border_box_size.block_size;
space.AvailableSize().block_size -
(geometry->border_box_size.block_size + margins->BlockSum());
ResolveAutoMargin(style.MarginBlockStartUsing(style),
style.MarginBlockEndUsing(style), additional_block_space,
&margins->block_start, &margins->block_end);

@@ -3422,6 +3422,7 @@ crbug.com/40341678 external/wpt/css/css-page/page-box-004-print.html [ Failure ]
crbug.com/40341678 external/wpt/css/css-page/page-box-005-print.html [ Failure ]
crbug.com/40341678 external/wpt/css/css-page/page-box-006-print.html [ Failure ]
crbug.com/40341678 external/wpt/css/css-page/page-box-007-print.html [ Failure ]
crbug.com/40341678 external/wpt/css/css-page/page-margin-auto-and-non-zero-print.html [ Failure ]
crbug.com/40341678 external/wpt/css/css-page/page-margin-auto-negative-print.tentative.html [ Failure ]
crbug.com/40341678 external/wpt/css/css-page/page-margin-auto-print.html [ Failure ]
crbug.com/40341678 external/wpt/css/css-page/page-size-013-print.html [ Failure ]
@@ -3435,6 +3436,7 @@ crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-box-
crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-box-005-print.html [ Pass ]
crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-box-006-print.html [ Pass ]
crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-box-007-print.html [ Pass ]
crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-margin-auto-and-non-zero-print.html [ Pass ]
crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-margin-auto-negative-print.tentative.html [ Pass ]
crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-margin-auto-print.html [ Pass ]
crbug.com/40341678 virtual/page-margin-boxes/external/wpt/css/css-page/page-size-013-print.html [ Pass ]

@@ -0,0 +1,41 @@
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<style>
@page {
size: 20em 7em;
margin: 0;
}
.pagebox {
break-before: page;
display: flex;
width: 20em;
height: 7em;
}
.pagebox > div {
flex: 1;
margin: 30px;
border: solid;
background: yellow;
}
body {
margin: 0;
}
</style>
<div class="pagebox">
<div>center / middle</div>
</div>
<div class="pagebox">
<div style="margin-top:0;">center / top</div>
</div>
<div class="pagebox">
<div style="margin-bottom:0;">center / bottom</div>
</div>
<div class="pagebox">
<div style="margin-top:0; margin-left:0;">top / left</div>
</div>
<div class="pagebox">
<div style="margin-top:0; margin-right:0;">top / right</div>
</div>
<div class="pagebox">
<div style="margin-bottom:0; margin-right:0;">bottom / right</div>
</div>

@@ -0,0 +1,52 @@
<!DOCTYPE html>
<link rel="author" title="Morten Stenshorne" href="mailto:mstensho@chromium.org">
<link rel="help" href="https://drafts.csswg.org/css-page-3/#page-properties">
<link rel="match" href="page-margin-auto-and-non-zero-print-ref.html">
<style>
@page {
size: 20em 7em;
border: solid;
margin: 30px;
}
@page aaa { }
@page bbb {
margin-top: auto;
}
@page ccc {
margin-bottom: auto;
}
@page ddd {
margin-top: auto;
margin-left: auto;
}
@page eee {
margin-top: auto;
margin-right: auto;
}
@page fff {
margin-bottom: auto;
margin-right: auto;
}
body {
margin: 0;
background: yellow;
}
</style>
<div style="page:aaa;">
center / middle
</div>
<div style="page:bbb;">
center / top
</div>
<div style="page:ccc;">
center / bottom
</div>
<div style="page:ddd;">
top / left
</div>
<div style="page:eee;">
top / right
</div>
<div style="page:fff;">
bottom / right
</div>