author | Mats Palmgren <mats@mozilla.com> |
Tue, 17 Dec 2019 23:13:13 +0000 | |
changeset 507492 | b5c8349e4e351559e92ff2704b0f36033395b24a |
parent 507491 | 44689b5ff306b9ebee413c4e0f0a32f88204ae5c |
child 507493 | 81beebdc2202c3a74844b7ff7614134ffeaf7846 |
push id | 103479 |
push user | mpalmgren@mozilla.com |
push date | Tue, 17 Dec 2019 23:22:44 +0000 |
treeherder | autoland@b5c8349e4e35 [default view] [failures only] |
perfherder | [talos] [build metrics] [platform microbench] (compared to previous push) |
reviewers | TYLin |
bugs | 1602430 |
milestone | 73.0a1 |
first release with | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
last release without | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
--- a/layout/generic/nsBlockFrame.cpp +++ b/layout/generic/nsBlockFrame.cpp @@ -1882,47 +1882,75 @@ void nsBlockFrame::ComputeFinalSize(cons // NOTE: We exempt the nsComboboxControlFrame subclass from taking this // special case, because comboboxes implicitly honors the size-containment // behavior on its nsComboboxDisplayFrame child (which it shrinkwraps) // rather than on the nsComboboxControlFrame. (Moreover, the DisplayFrame // child doesn't even need any special content-size-ignoring behavior in // its reflow method, because that method just resolves "auto" BSize values // to one line-height rather than by measuring its contents' BSize.) nscoord contentBSize = 0; - nscoord autoBSize = aReflowInput.ApplyMinMaxBSize(contentBSize); + nscoord autoBSize = + aReflowInput.ApplyMinMaxBSize(contentBSize, aState.mConsumedBSize); aMetrics.mCarriedOutBEndMargin.Zero(); autoBSize += borderPadding.BStartEnd(wm); finalSize.BSize(wm) = autoBSize; } else if (aState.mReflowStatus.IsComplete()) { nscoord contentBSize = blockEndEdgeOfChildren - borderPadding.BStart(wm); nscoord lineClampedContentBSize = ApplyLineClamp(aReflowInput, this, contentBSize); - nscoord autoBSize = aReflowInput.ApplyMinMaxBSize(lineClampedContentBSize); + nscoord autoBSize = aReflowInput.ApplyMinMaxBSize(lineClampedContentBSize, + aState.mConsumedBSize); if (autoBSize != contentBSize) { // Our min-block-size, max-block-size, or -webkit-line-clamp value made // our bsize change. Don't carry out our kids' block-end margins. aMetrics.mCarriedOutBEndMargin.Zero(); } - autoBSize += borderPadding.BStart(wm) + borderPadding.BEnd(wm); - finalSize.BSize(wm) = autoBSize; + nscoord bSize = autoBSize + borderPadding.BStartEnd(wm); + if (MOZ_UNLIKELY(autoBSize > contentBSize && + bSize > aReflowInput.AvailableBSize() && + aReflowInput.AvailableBSize() != NS_UNCONSTRAINEDSIZE)) { + // Applying `min-size` made us overflow our available size. + // Clamp it and report that we're Incomplete. + bSize = aReflowInput.AvailableBSize(); + aState.mReflowStatus.SetIncomplete(); + } + finalSize.BSize(wm) = bSize; } else { NS_ASSERTION(aReflowInput.AvailableBSize() != NS_UNCONSTRAINEDSIZE, "Shouldn't be incomplete if availableBSize is UNCONSTRAINED."); if (aState.mBCoord == nscoord_MAX) { // FIXME bug 1574046. // This should never happen, but it does. nsFloatManager::ClearFloats // returns |nscoord_MAX| when DONT_CLEAR_PUSHED_FLOATS is false. blockEndEdgeOfChildren = aState.mBCoord = aReflowInput.AvailableBSize(); } - finalSize.BSize(wm) = - std::max(aState.mBCoord, aReflowInput.AvailableBSize()); + nscoord bSize = std::max(aState.mBCoord, aReflowInput.AvailableBSize()); if (aReflowInput.AvailableBSize() == NS_UNCONSTRAINEDSIZE) { // This should never happen, but it does. See bug 414255 - finalSize.BSize(wm) = aState.mBCoord; - } + bSize = aState.mBCoord; + } + const nscoord maxBSize = aReflowInput.ComputedMaxBSize(); + if (maxBSize != NS_UNCONSTRAINEDSIZE && + // FIXME: wallpaper for bug 1603088 + !(Style()->GetPseudoType() == PseudoStyleType::columnContent || + Style()->GetPseudoType() == PseudoStyleType::columnSet) && + aState.mConsumedBSize + bSize - borderPadding.BStart(wm) > maxBSize) { + nscoord bEnd = std::max(0, maxBSize - aState.mConsumedBSize) + + borderPadding.BStart(wm); + // Note that |borderPadding| has GetSkipSides applied, so we ask + // aReflowInput for the actual value we'd use on a last fragment here: + bEnd += aReflowInput.ComputedLogicalBorderPadding().BEnd(wm); + if (bEnd <= aReflowInput.AvailableBSize()) { + // We actually fit after applying `max-size` so we should be + // Overflow-Incomplete instead. + bSize = bEnd; + aState.mReflowStatus.SetOverflowIncomplete(); + } + } + finalSize.BSize(wm) = bSize; } if (IS_TRUE_OVERFLOW_CONTAINER(this)) { if (aState.mReflowStatus.IsIncomplete()) { // Overflow containers can only be overflow complete. // Note that auto height overflow containers have no normal children NS_ASSERTION(finalSize.BSize(wm) == 0, "overflow containers must be zero-block-size");
--- a/layout/generic/nsSplittableFrame.cpp +++ b/layout/generic/nsSplittableFrame.cpp @@ -181,16 +181,24 @@ void nsSplittableFrame::RemoveFromFlow(n } aFrame->SetPrevInFlow(nullptr); aFrame->SetNextInFlow(nullptr); } nscoord nsSplittableFrame::ConsumedBSize(WritingMode aWM) const { nscoord bSize = 0; + + // FIXME: wallpaper the bogus max-block-size:100% in ua.css (bug 1603088) + const auto& pseudoType = Style()->GetPseudoType(); + if (pseudoType == PseudoStyleType::columnContent || + pseudoType == PseudoStyleType::columnSet) { + return bSize; + } + for (nsIFrame* prev = GetPrevContinuation(); prev; prev = prev->GetPrevContinuation()) { bSize += prev->ContentBSize(aWM); } return bSize; } nscoord nsSplittableFrame::GetEffectiveComputedBSize(
new file mode 100644 --- /dev/null +++ b/layout/reftests/pagination/block-max-height-001-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html class="reftest-paged"> +<head> + <title>Reference: max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <meta name="flags" content="paged"> + <style> +@page { size:5in 3in; margin:0.5in; } +html,body { + color:black; background-color:white; font:0.5in/1 monospace; padding:0; margin:0; +} +</style> +</head> +<body> + BEFORE + <div style="height:2in"> + <div style="height:3in; width:1in; border:solid"></div> + </div> + AFTER +</body> +</html>
new file mode 100644 --- /dev/null +++ b/layout/reftests/pagination/block-max-height-001.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html class="reftest-paged"> +<head> + <title>CSS Test: max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <meta name="flags" content="paged"> + <style> +@page { size:5in 3in; margin:0.5in; } +html,body { + color:black; background-color:white; font:0.5in/1 monospace; padding:0; margin:0; +} +</style> +</head> +<body> + BEFORE + <div style="max-height:2in"> + <div style="height:3in; width:1in; border:solid"></div> + </div> + AFTER +</body> +</html>
new file mode 100644 --- /dev/null +++ b/layout/reftests/pagination/block-max-height-002.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html class="reftest-paged"> +<head> + <title>CSS Test: min/max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <meta name="flags" content="paged"> + <style> +@page { size:5in 3in; margin:0.5in; } +html,body { + color:black; background-color:white; font:0.5in/1 monospace; padding:0; margin:0; +} +</style> +</head> +<body> + BEFORE + <div style="min-height:1.8in; max-height:2in"> + <div style="height:3in; width:1in; border:solid"></div> + </div> + AFTER +</body> +</html>
new file mode 100644 --- /dev/null +++ b/layout/reftests/pagination/block-min-height-001-ref.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html class="reftest-paged"> +<head> + <title>Reference: min-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <meta name="flags" content="paged"> + <style> +@page { size:5in 3in; margin:0.5in; } +html,body { + color:black; background-color:white; font:0.5in/1 monospace; padding:0; margin:0; +} +</style> +</head> +<body> + BEFORE + <div style="height:3in"> + <div style="height:2in; width:1in; border:solid"></div> + </div> + AFTER +</body> +</html>
new file mode 100644 --- /dev/null +++ b/layout/reftests/pagination/block-min-height-001.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html class="reftest-paged"> +<head> + <title>CSS Test: max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <meta name="flags" content="paged"> + <style> +@page { size:5in 3in; margin:0.5in; } +html,body { + color:black; background-color:white; font:0.5in/1 monospace; padding:0; margin:0; +} +</style> +</head> +<body> + BEFORE + <div style="min-height:3in"> + <div style="height:2in; width:1in; border:solid"></div> + </div> + AFTER +</body> +</html>
new file mode 100644 --- /dev/null +++ b/layout/reftests/pagination/block-min-height-002.html @@ -0,0 +1,21 @@ +<!DOCTYPE html> +<html class="reftest-paged"> +<head> + <title>CSS Test: min/max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <meta name="flags" content="paged"> + <style> +@page { size:5in 3in; margin:0.5in; } +html,body { + color:black; background-color:white; font:0.5in/1 monospace; padding:0; margin:0; +} +</style> +</head> +<body> + BEFORE + <div style="min-height:3in; max-height:2in"> + <div style="height:2in; width:1in; border:solid"></div> + </div> + AFTER +</body> +</html>
--- a/layout/reftests/pagination/reftest.list +++ b/layout/reftests/pagination/reftest.list @@ -155,16 +155,21 @@ pref(layout.css.column-span.enabled,true == fieldset-00H-grid.html fieldset-00H-ref.html == fieldset-00I.html fieldset-00I-ref.html == fieldset-00I-grid.html fieldset-00I-ref.html == fieldset-00J.html fieldset-00J-ref.html == fieldset-00J-grid.html fieldset-00J-ref.html == fieldset-00K.html fieldset-00K-ref.html == fieldset-00L.html fieldset-00L-ref.html +== block-max-height-001.html block-max-height-001-ref.html +== block-max-height-002.html block-max-height-001-ref.html +== block-min-height-001.html block-min-height-001-ref.html +== block-min-height-002.html block-min-height-001-ref.html + == bfc-001.html bfc-001-ref.html == bfc-002.html bfc-001-ref.html == bfc-003.html bfc-001-ref.html -fails == bfc-004.html bfc-004-ref.html # bug 1602430 and bug 1602484 +fails == bfc-004.html bfc-004-ref.html # bug 1602484 == bfc-005.html bfc-004-ref.html == bfc-006.html bfc-006-ref.html -fails == bfc-007.html bfc-006-ref.html # bug 1602430 -fails == bfc-008.html bfc-006-ref.html # bug 1602430 +== bfc-007.html bfc-006-ref.html +== bfc-008.html bfc-006-ref.html
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-001-ref.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<html> +<head> + <title>Reference: max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { height:160px; background: yellow; } +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-001.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-max-height-001-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { max-height:160px; background: yellow; } +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-001b-ref.html @@ -0,0 +1,56 @@ +<!DOCTYPE html> +<html> +<head> + <title>Reference: max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { + height: 128px; + background: yellow; + border: solid; + border-width:10px 0 6px 0; + padding: 5px 0 3px 0; +} +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-001b.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-max-height-001b-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { + max-height: 128px; + background: yellow; + border: solid; + border-width:10px 0 6px 0; + padding: 5px 0 3px 0; +} +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-002.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: min/max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-max-height-001-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { min-height:120px; max-height:160px; background: yellow; } +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-002b.html @@ -0,0 +1,60 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: min/max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-max-height-001b-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { + min-height: 112px; + max-height: 128px; + background: yellow; + border: solid; + border-width:10px 0 6px 0; + padding: 5px 0 3px 0; +} +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-003.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: min/max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-max-height-001-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { min-height:160px; max-height:110px; background: yellow; } +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-max-height-003b.html @@ -0,0 +1,60 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: min/max-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-max-height-001b-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { + min-height: 128px; + max-height: 112px; + background: yellow; + border: solid; + border-width:10px 0 6px 0; + padding: 5px 0 3px 0; +} +.columns > div > div { height:200px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-min-height-001-ref.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<html> +<head> + <title>Reference: min-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { height:200px; background: yellow; } +.columns > div > div { height:160px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-min-height-001.html @@ -0,0 +1,53 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: min-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-min-height-001-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { min-height:200px; background: yellow; } +.columns > div > div { height:160px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-min-height-001b-ref.html @@ -0,0 +1,56 @@ +<!DOCTYPE html> +<html> +<head> + <title>Reference: min-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { + height: 172px; + background: yellow; + border: solid; + border-width:10px 0 6px 0; + padding: 5px 0 3px 0; +} +.columns > div > div { height:150px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>
new file mode 100644 --- /dev/null +++ b/testing/web-platform/tests/css/css-break/block-min-height-001b.html @@ -0,0 +1,59 @@ +<!DOCTYPE html> +<html> +<head> + <title>CSS Test: min-height block fragmentation</title> + <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> + <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> + <link rel="help" href="https://drafts.csswg.org/css-break"> + <link rel="match" href="block-min-height-001b-ref.html"> + <style> +html,body { + color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; + width: 300px; +} +.columns { + columns: 3; + background: grey; + margin-bottom: 1em; +} +.columns > div { + min-height: 172px; + background: yellow; + border: solid; + border-width:10px 0 6px 0; + padding: 5px 0 3px 0; +} +.columns > div > div { height:150px; width:50px; border:solid; } + </style> +</head> +<body> +<div class="columns"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:100px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:70px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +<div class="columns" style="height:50px"> + BEFORE + <div> + <div></div> + </div> + AFTER +</div> +</body> +</html>