41 lines
1.3 KiB
HTML
41 lines
1.3 KiB
HTML
<!DOCTYPE html>
|
||
<link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org">
|
||
<link rel="help" href="https://drafts.csswg.org/css-flexbox/#flex-base-size">
|
||
<link rel="match" href="../reference/ref-filled-green-100px-square-only.html">
|
||
<meta name="assert" content="A flex container's block cross size of fit-content is treated as indefinite when setting fit-content on an item for flex base sizing">
|
||
|
||
<style>
|
||
x-flexbox {
|
||
display: flex;
|
||
height: fit-content;
|
||
}
|
||
|
||
.fit-content-item {
|
||
background: green;
|
||
width: 100px;
|
||
writing-mode: vertical-lr;
|
||
}
|
||
|
||
.height-setting-item {
|
||
height: 100px;
|
||
}
|
||
|
||
</style>
|
||
|
||
<!-- This has to be a row flexbox whose item stretches and has vertical writing
|
||
mode to trigger:
|
||
* a cross size is needed to determine the main size (row flexbox's cross size
|
||
is vertical, which is the item's inline size because it has a vertical
|
||
writing mode)
|
||
* the flex item’s cross size is [...] not definite (if the item didn't
|
||
stretch, the definiteness of the container's cross size wouldn't matter
|
||
because the cross size would never be definite and the item would always get
|
||
fit-content)
|
||
-->
|
||
|
||
<p>Test passes if there is a filled green square.</p>
|
||
|
||
<x-flexbox>
|
||
<div class="fit-content-item"></div>
|
||
<div class="height-setting-item"></div>
|
||
</x-flexbox>
|