Skip to content

GitLab

T
tangled
Commit d71b5e2c authored by Christian Biesinger's avatar Christian Biesinger Committed by Commit Bot
Browse files
Options

Make LogicalHeightComputesAsNone check the override cb height 

If the override height is indefinite, this function should return true.
This fixes the case of max-height: xx% on a replaced item in a flexbox,
which otherwise would get resolved to 0 because resolving the percentage
for replaced items would convert negative numbers to 0.

Fixed: 1048051
Change-Id: I192e65b37a3670226fa764662448bdb4216c9fe1
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2100771
Auto-Submit: Christian Biesinger <cbiesinger@chromium.org>
Reviewed-by: default avatarDavid Grogan <dgrogan@chromium.org>
Commit-Queue: Christian Biesinger <cbiesinger@chromium.org>
Cr-Commit-Position: refs/heads/master@{#750285}
parent c29bddc2
Hide whitespace changes
Inline Side-by-side
Showing with 29 additions and 0 deletions
third_party/blink/renderer/core/layout/layout_box.cc
View file @ d71b5e2c
...@@ -4197,6 +4197,11 @@ bool LayoutBox::LogicalHeightComputesAsNone(SizeType size_type) const { ...@@ -4197,6 +4197,11 @@ bool LayoutBox::LogicalHeightComputesAsNone(SizeType size_type) const {
if (logical_height == initial_logical_height) if (logical_height == initial_logical_height)
return true; return true;
if (logical_height.IsPercentOrCalc() &&
HasOverrideContainingBlockContentLogicalHeight() &&
OverrideContainingBlockContentLogicalHeight() == kIndefiniteSize)
return true;
// CustomLayout items can resolve their percentages against an available or // CustomLayout items can resolve their percentages against an available or
// percentage size override. // percentage size override.
if (IsCustomItem() && (HasOverrideContainingBlockContentLogicalHeight() || if (IsCustomItem() && (HasOverrideContainingBlockContentLogicalHeight() ||
......
third_party/blink/web_tests/external/wpt/css/css-flexbox/percentage-max-height-001.html 0 → 100644
View file @ d71b5e2c
<!DOCTYPE html>
<style>
.flexbox {
height: 100px;
width: 100px;
display: flex;
flex-direction: column;
background-color: red;
}
.flexbox img {
max-height: 100%;
min-height: 0;
}
</style>
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
<link rel="help" href="https://www.w3.org/TR/css-flexbox-1/#layout-algorithm" title="9. Flex Layout Algorithm">
<link rel="author" title="Google LLC" href="https://www.google.com/">
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div class="flexbox">
<img src="support/100x100-green.png">
</div>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment