Skip to content

Flexbox: apply transferred min/max sizes to flex base size and hypothetical sizes - #989

Merged
nicoburns merged 2 commits into
mainfrom
devin/1784873230-flex-transferred-sizes
Jul 25, 2026
Merged

Flexbox: apply transferred min/max sizes to flex base size and hypothetical sizes#989
nicoburns merged 2 commits into
mainfrom
devin/1784873230-flex-transferred-sizes

Conversation

@nicoburns

@nicoburns nicoburns commented Jul 24, 2026

Copy link
Copy Markdown
Member

Objective

Fix flexbox sizing of items with an aspect ratio and min/max constraints in the opposite axis (e.g. replaced images with max-height in a row flex container). Previously, transferred sizes were baked directly into FlexItem::min_size/max_size via maybe_apply_aspect_ratio, so they incorrectly participated in resolving flexible lengths and clamping the item's final size. Per w3c/csswg-drafts#10997 and browser behaviour, transferred sizes should only clamp:

  • the flex base size / hypothetical main size,
  • the content-based part of the automatic minimum size (§4.5 transferred size suggestion / content size suggestion cap),
  • the hypothetical cross size.

Pseudo-diff of the approach:

 FlexItem {
-    min_size: style.min_size.resolve(..).maybe_apply_aspect_ratio(ar),
-    max_size: style.max_size.resolve(..).maybe_apply_aspect_ratio(ar),
+    min_size: style.min_size.resolve(..),   // untransferred
+    max_size: style.max_size.resolve(..),
+    aspect_ratio: ar,                       // stored; transfer applied at use sites
 }

In determine_flex_base_size and determine_hypothetical_cross_size, transferred_{min,max}_size = child.{min,max}_size.maybe_apply_aspect_ratio(child.aspect_ratio) are now used for: the cross-axis available-space clamp, the known-cross-dimension clamp, the automatic-minimum-size cap, and the hypothetical main/cross size clamps. Elsewhere (flexible length resolution, final clamping) the untransferred min/max sizes are used, as before this change they were the transferred ones.

Context

Found while fixing css-flexbox WPT failures in Blitz (companion PR: DioxusLabs/blitz#526). With this change plus the Blitz-side fixes, the following WPT tests newly pass: flex-minimum-width-flex-items-012, flexbox-min-width-auto-002c, flexbox-min-height-auto-002c, flex-minimum-height-flex-items-021, flex-aspect-ratio-img-column-005, aspect-ratio-transferred-max-size — with no regressions across the full css-flexbox suite (699 → 705 whole tests, 1765 → 1771 subtests).

All existing Taffy tests pass (cargo test: 4421 generated fixture tests green).

Feedback wanted

Taffy currently applies aspect ratios to border-box sizes; a fully content-box-aware transfer (needed for items with asymmetric borders, e.g. WPT flex-aspect-ratio-img-row-005 subtest 3) is left for follow-up.

Link to Devin session: https://app.devin.ai/sessions/0f8547b7fbb949e28e9acdbedb1ca8d2
Requested by: @nicoburns


Devin Review

Status Commit
⚪ Not started

Run Devin Review

Open in Devin Review (Staging)

@nicoburns nicoburns self-assigned this Jul 24, 2026
@devin-ai-integration

Copy link
Copy Markdown
Contributor

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

  • Address comments on this PR that start with 'DevinAI' or '@devin'.
  • Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

  • Disable automatic comment, CI, and merge conflict monitoring

@nicoburns
nicoburns marked this pull request as ready for review July 25, 2026 01:58
@nicoburns
nicoburns enabled auto-merge (squash) July 25, 2026 01:58
@nicoburns
nicoburns force-pushed the devin/1784873230-flex-transferred-sizes branch from a1ebac1 to 4708ca9 Compare July 25, 2026 01:58
@nicoburns
nicoburns merged commit 0972b84 into main Jul 25, 2026
27 checks passed
@nicoburns
nicoburns deleted the devin/1784873230-flex-transferred-sizes branch July 25, 2026 01:59
nicoburns pushed a commit to HelgeSverre/taffy that referenced this pull request Aug 21, 2026
A flex child with a style width that resolves wider than its own
max_width (width: 100% of a wider parent, or a fixed width above the
cap) used to have its content measured at the unclamped width while
being laid out at the clamped one. A measure function whose height
depends on width (wrapped text) then reported a taller size in the
final pass than the height reserved from the sizing pass, and the
child's flex base size went stale: the child and its ancestors ended up
shorter than the content painted inside them.

The clamp added in DioxusLabs#989 (motivated by aspect-ratio transferred sizes)
also fixed this for plain min/max constraints, but left the
measure-function case untested. These tests pin it down with wrapping
Ahem text whose line count differs between the unclamped and clamped
widths, through both the definite-parent path and the intrinsic-sizing
path.
nicoburns pushed a commit to HelgeSverre/taffy that referenced this pull request Aug 25, 2026
A flex child with a style width that resolves wider than its own
max_width (width: 100% of a wider parent, or a fixed width above the
cap) used to have its content measured at the unclamped width while
being laid out at the clamped one. A measure function whose height
depends on width (wrapped text) then reported a taller size in the
final pass than the height reserved from the sizing pass, and the
child's flex base size went stale: the child and its ancestors ended up
shorter than the content painted inside them.

The clamp added in DioxusLabs#989 (motivated by aspect-ratio transferred sizes)
also fixed this for plain min/max constraints, but left the
measure-function case untested. These tests pin it down with wrapping
Ahem text whose line count differs between the unclamped and clamped
widths, through both the definite-parent path and the intrinsic-sizing
path.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant