Implement the layout-affecting parts of CSS layout and paint containment - #1128
Merged
Conversation
Adds a Contain style type with LAYOUT and PAINT flags, a Style::contain field and a defaulted CoreStyle::contain() accessor, plus CSS parsing support for the contain property (none | content | [ layout || style || paint ]). Layout and paint containment make the box establish an independent formatting context (margins do not collapse with children, floats are contained/avoided) and prevent the box's overflowing content from contributing to its ancestors' scrollable overflow regions. Layout containment additionally suppresses the box's baseline. Also fixes a preexisting bug where the overflowing in-flow content of a nested block contributed to the height of its BFC root as if it were floated content.
🤖 Devin AI EngineerI'll be helping with this pull request! Here's what you should know: ✅ I will automatically:
Note: I can only respond to comments from users who have write access to this repository. ⚙️ Control Options:
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Objective
Add a
containstyle to Taffy withlayoutandpaintflags, and implement their layout effects. Based on the previously-reverted #1106, but with all size / inline-size containment stripped out.New style API:
Implemented effects (both
layoutandpaint, since both force an independent formatting context):scrollable_overflow_rectstill includes itlayoutonly: the box's baseline is suppressed for baseline-alignment purposes in block, flexbox and grid containers (a synthesized border-box baseline is used where one is required)CSS parsing (
parsefeature) acceptsnone | content | [ layout || style || paint ];styleis accepted and ignored (no layout effect);strict/size/inline-sizeare rejected as size containment is not implemented.Also fixes a preexisting block/float bug this work surfaced: overflowing in-flow content of a nested block no longer contributes to the height of its BFC root as if it were floated content (
float_content_contributionnow starts atNEG_INFINITYinstead of the content edge).CHANGELOG.md is updated under Added/Fixed.
Context
containproperty #1106containattribute in fixtures/helper/xml runner) with new generated fixtures undertest_fixtures/contain/covering margin collapsing, float containment/avoidance,contain: content, and flex baseline suppression for bothlayoutandpaintcontain: layout/contain: paintfrom Stylo (link to follow)Feedback wanted
Containas a minimal hand-rolled bitflags type (rather than abitflags!dependency or an enum) is the preferred representationscrollable_overflow_rectunclipped — forpainta consumer may additionally want to clip when paintingLink to Devin session: https://dioxus.staging.devinenterprise.com/sessions/c903534a83f54a6daf2f68f4cc38cf72
Requested by: @nicoburns