Skip to content

Commit

Permalink
[FlexNG] Set MinSizeShouldEncompassIntrinsicSize
Browse files Browse the repository at this point in the history
SetMinBlockSizeShouldEncompassIntrinsicSize() on a flex item
to allow the item to grow as a result of fragmentation.

In order for this flag to have an effect on flex items inside
a column flex container, we also had to SetIsFixedBlockSize()
to false.

This will be used to expand the flex lines if needed.

Bug: 660611
Change-Id: I8890cc54262c14664706b9cb9efb141a453dceff
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3276791
Commit-Queue: Alison Maher <almaher@microsoft.com>
Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org>
Reviewed-by: Morten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/main@{#941410}
  • Loading branch information
alisonmaher authored and chromium-wpt-export-bot committed Nov 13, 2021
1 parent f658673 commit dc91bc4
Show file tree
Hide file tree
Showing 2 changed files with 30 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<!DOCTYPE html>
<title>
Tests that a flex-item grows due to fragmentation.
</title>
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div style="width: 100px; height: 100px; columns: 2; column-gap: 0; background: red;">
<div style="display: flex; flex-direction: column;">
<div style="line-height: 0; background: green;">
<div style="display: inline-block; width: 50px; height: 50px;"></div>
<div style="display: inline-block; width: 50px; height: 100px;"></div>
</div>
</div>
</div>
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
<!DOCTYPE html>
<title>
Tests that a flex-item with a fixed block-size container grows due to fragmentation.
</title>
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#pagination">
<link rel="match" href="../../reference/ref-filled-green-100px-square.xht">
<p>Test passes if there is a filled green square and <strong>no red</strong>.</p>
<div style="width: 100px; height: 100px; columns: 2; column-gap: 0; background: red;">
<div style="display: flex; flex-direction: column; height: 100px;">
<div style="line-height: 0; background: green;">
<div style="display: inline-block; width: 50px; height: 50px;"></div>
<div style="display: inline-block; width: 50px; height: 100px;"></div>
</div>
</div>
</div>

0 comments on commit dc91bc4

Please sign in to comment.