Skip to content
This repository was archived by the owner on Mar 19, 2021. It is now read-only.

Commit 99fda55

Browse files
davidsgroganchromium-wpt-export-bot
davidsgrogan
authored and
chromium-wpt-export-bot
committed
[LayoutNG] First part of ShrinkToFit for flex items
Two places in the spec call for treating an item's inline size as 'fit-content' under certain conditions. This patch implements that logic. 4 tests now pass and 2 "regress": FlexNG previously rendered the scrollbars tests and their references so incorrectly that the first 800x600 pixels matched but most of rest of the output actually did not match. Both the tests and their references are rendered better now, but the differences now show up in the first 800x600 pixels. Bug: 845235 Change-Id: I60de7ba4a26e54f6f171ba8a5e05299c3e953452 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1737742 Reviewed-by: Christian Biesinger <[email protected]> Commit-Queue: David Grogan <[email protected]> Cr-Commit-Position: refs/heads/master@{#684952}
1 parent b362430 commit 99fda55

File tree

1 file changed

+44
-0
lines changed

1 file changed

+44
-0
lines changed

‎css/css-flexbox/fit-content-item-001.html

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<!DOCTYPE html>
2+
<link rel="author" title="David Grogan" href="mailto:[email protected]">
3+
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-base-size">
4+
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#algo-cross-item">
5+
<link rel="match" href="../reference/ref-filled-green-100px-square.xht">
6+
<meta name="flags" content="" />
7+
<meta name="assert" content="A column flex container shrink wraps items both when determining their flex base sizes and when laying them out after their flexed size has been determined." />
8+
9+
<style>
10+
11+
x-flexbox {
12+
display: flex;
13+
flex-direction: column;
14+
}
15+
16+
x-item {
17+
display: block;
18+
background: red;
19+
/* Override default alignment of "stretch" because items don't shrink to fit
20+
when they are stretched. */
21+
align-self: start;
22+
}
23+
24+
#mainSizeDependsOnCrossSize {
25+
padding-bottom: 50%;
26+
background: green;
27+
}
28+
29+
#widthSetter {
30+
width: 100px;
31+
height: 50px;
32+
background: green;
33+
}
34+
35+
</style>
36+
37+
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
38+
39+
<x-flexbox>
40+
<x-item> <!-- If fit-content is skipped when determining flex base size, this item gets a main size of 50px + 100vw / 2. -->
41+
<div id=widthSetter></div>
42+
<div id=mainSizeDependsOnCrossSize></div>
43+
</x-item>
44+
</x-flexbox>

0 commit comments

Comments
 (0)