зеркало из https://github.com/mozilla/gecko-dev.git
Bug 1474663 - Implement contain:size for nsColumnSetFrame. r=dholbert
MozReview-Commit-ID: EE7Un9LUJcV --HG-- extra : rebase_source : 7e3a3946b93bd3853e2ebfceeb93c28231f12c83
This commit is contained in:
Morgan Rae Reschenberg
Родитель
1387148cf0
Коммит
16a0e6cd2f
|
|
@ -494,7 +494,11 @@ nsColumnSetFrame::GetMinISize(gfxContext *aRenderingContext)
|
|||
{
|
||||
nscoord iSize = 0;
|
||||
DISPLAY_MIN_WIDTH(this, iSize);
|
||||
if (mFrames.FirstChild()) {
|
||||
|
||||
if (mFrames.FirstChild() && !StyleDisplay()->IsContainSize()) {
|
||||
// We want to ignore this in the case that we're size contained
|
||||
// because our children should not contribute to our
|
||||
// intrinsic size.
|
||||
iSize = mFrames.FirstChild()->GetMinISize(aRenderingContext);
|
||||
}
|
||||
const nsStyleColumn* colStyle = StyleColumn();
|
||||
|
|
@ -539,7 +543,10 @@ nsColumnSetFrame::GetPrefISize(gfxContext *aRenderingContext)
|
|||
nscoord colISize;
|
||||
if (colStyle->mColumnWidth.GetUnit() == eStyleUnit_Coord) {
|
||||
colISize = colStyle->mColumnWidth.GetCoordValue();
|
||||
} else if (mFrames.FirstChild()) {
|
||||
} else if (mFrames.FirstChild() && !StyleDisplay()->IsContainSize()) {
|
||||
// We want to ignore this in the case that we're size contained
|
||||
// because our children should not contribute to our
|
||||
// intrinsic size.
|
||||
colISize = mFrames.FirstChild()->GetPrefISize(aRenderingContext);
|
||||
} else {
|
||||
colISize = 0;
|
||||
|
|
@ -908,6 +915,11 @@ nsColumnSetFrame::ReflowChildren(ReflowOutput& aDesiredSize,
|
|||
} else {
|
||||
contentSize.BSize(wm) = aConfig.mComputedBSize;
|
||||
}
|
||||
} else if (aReflowInput.mStyleDisplay->IsContainSize()) {
|
||||
// If we are intrinsically sized, but are size contained,
|
||||
// we need to behave as if we have no contents. Our BSize
|
||||
// should be zero or minBSize if specified.
|
||||
contentSize.BSize(wm) = aReflowInput.ApplyMinMaxBSize(0);
|
||||
} else {
|
||||
// We add the "consumed" block-size back in so that we're applying
|
||||
// constraints to the correct bSize value, then subtract it again
|
||||
|
|
|
|||
|
|
@ -0,0 +1,49 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Morgan Rae Reschenberg" href="mailto:mreschenberg@berkeley.edu">
|
||||
<style>
|
||||
.basic {
|
||||
border: 1em solid green;
|
||||
column-count: 3;
|
||||
}
|
||||
.height-ref {
|
||||
height: 20px;
|
||||
background: lightblue;
|
||||
}
|
||||
.width-ref {
|
||||
width: 20px;
|
||||
}
|
||||
.floatLBasic-ref {
|
||||
float: left;
|
||||
}
|
||||
.floatLWidth-ref {
|
||||
float: left;
|
||||
width: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="basic"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic height-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic height-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic width-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic width-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic floatLBasic-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic floatLWidth-ref"></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,72 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: 'contain: size' on multicol elements should cause them to be sized as if they had no contents.</title>
|
||||
<link rel="author" title="Morgan Rae Reschenberg" href="mailto:mreschenberg@berkeley.edu">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-size">
|
||||
<link rel="match" href="contain-size-multicol-002-ref.html">
|
||||
<style>
|
||||
.contain {
|
||||
contain: size;
|
||||
border: 1em solid green;
|
||||
background: red;
|
||||
column-count: 3;
|
||||
}
|
||||
.innerContents {
|
||||
color: transparent;
|
||||
height: 50px;
|
||||
width: 50px;
|
||||
}
|
||||
.minHeight {
|
||||
min-height: 20px;
|
||||
background: lightblue;
|
||||
}
|
||||
.height {
|
||||
height: 20px;
|
||||
background: lightblue;
|
||||
}
|
||||
.maxWidth {
|
||||
max-width: 20px;
|
||||
}
|
||||
.width {
|
||||
width: 20px;
|
||||
}
|
||||
.floatLBasic {
|
||||
float: left;
|
||||
}
|
||||
.floatLWidth {
|
||||
float: left;
|
||||
width: 20px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!--CSS Test: A size-contained multicol element with no specified size should render at 0 height regardless of content.-->
|
||||
<div class="contain"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<!--CSS Test: A size-contained multicol element with specified min-height should render at given min-height regardless of content.-->
|
||||
<div class="contain minHeight"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<!--CSS Test: A size-contained multicol element with specified height should render at given height regardless of content.-->
|
||||
<div class="contain height"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<!--CSS Test: A size-contained multicol element with specified max-width should render at given max-width and zero height regardless of content.-->
|
||||
<div class="contain maxWidth"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<!--CSS Test: A size-contained multicol element with specified width should render at given width and zero height regardless of content.-->
|
||||
<div class="contain width"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<!--CSS Test: A size-contained floated multicol element with no specified size should render at 0px by 0px regardless of content.-->
|
||||
<div class="contain floatLBasic"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<!--CSS Test: A size-contained floated multicol element with specified width and no specified height should render at given width and 0 height regardless of content.-->
|
||||
<div class="contain floatLWidth"><div class="innerContents">inner</div></div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,57 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Reftest Reference</title>
|
||||
<link rel="author" title="Morgan Rae Reschenberg" href="mailto:mreschenberg@berkeley.edu">
|
||||
<style>
|
||||
.basic {
|
||||
border: 1em solid green;
|
||||
column-count: 3;
|
||||
}
|
||||
.col-width-ref {
|
||||
column-width: 20px;
|
||||
}
|
||||
.col-gap-ref {
|
||||
column-gap: 5px;
|
||||
}
|
||||
.flexBaselineCheck {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
}
|
||||
.min {
|
||||
width: -moz-min-content;
|
||||
}
|
||||
.max {
|
||||
width: -moz-max-content;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="flexBaselineCheck">
|
||||
outside before<div class="basic"></div>outside after
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<div class="basic min col-width-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic max col-width-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic min col-gap-ref col-width-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="basic max col-gap-ref col-width-ref"></div>
|
||||
<br>
|
||||
|
||||
<div class="min">
|
||||
<div class="basic"></div>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<div class="max">
|
||||
<div class="basic"></div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>CSS Test: 'contain: size' on multicol elements should cause them to be sized and baseline-aligned as if they had no contents.</title>
|
||||
<link rel="author" title="Morgan Rae Reschenberg" href="mailto:mreschenberg@berkeley.edu">
|
||||
<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-size">
|
||||
<link rel="match" href="contain-size-multicol-003-ref.html">
|
||||
<style>
|
||||
.contain {
|
||||
contain: size;
|
||||
border: 1em solid green;
|
||||
background: red;
|
||||
column-count: 3;
|
||||
}
|
||||
.innerContents {
|
||||
color: transparent;
|
||||
height: 100px;
|
||||
width: 100px;
|
||||
}
|
||||
.col-width {
|
||||
column-width: 20px;
|
||||
}
|
||||
.col-gap {
|
||||
column-gap: 5px;
|
||||
}
|
||||
.flexBaselineCheck {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
}
|
||||
.min {
|
||||
width: -moz-min-content;
|
||||
}
|
||||
.max {
|
||||
width: -moz-max-content;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!--CSS Test: A size-contained multicol element should perform baseline alignment as if it had no contents.-->
|
||||
<div class="flexBaselineCheck">
|
||||
outside before<div class="contain"><div class="innerContents">inner</div></div>outside after
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<!--The following tests are used to ensure column-gaps and column-widths continue to contribute to the minimum and maximum width of a size-contained multicol element. Each should render as if it had no contents.-->
|
||||
|
||||
<div class="contain min col-width"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<div class="contain max col-width"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<div class="contain min col-gap col-width"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<div class="contain max col-gap col-width"><div class="innerContents">inner</div></div>
|
||||
<br>
|
||||
|
||||
<div class="min">
|
||||
<div class="contain">
|
||||
<div class="innerContents">inner</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
|
||||
<div class="max">
|
||||
<div class="contain">
|
||||
<div class="innerContents">inner</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -23,3 +23,5 @@ pref(layout.css.overflow-clip-box.enabled,true) == contain-paint-clip-006.html c
|
|||
== contain-size-flex-001.html contain-size-flex-001-ref.html
|
||||
fuzzy-if(webrender&&winWidget,3,2) == contain-size-inline-flex-001.html contain-size-inline-flex-001-ref.html # bug 1474093
|
||||
== contain-size-multicol-001.html contain-size-multicol-001-ref.html
|
||||
== contain-size-multicol-002.html contain-size-multicol-002-ref.html
|
||||
== contain-size-multicol-003.html contain-size-multicol-003-ref.html
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче