First Working Draft of CSS Transitions Level 2
The CSS Working Group has published an First Public Working Draft of
CSS Transitions Level 2. CSS Transitions allow property changes in CSS values to occur smoothly (or discretely) over a specified duration.
Level 2 (currently written as a delta specification, since Level 1 is not complete) introduces two new features:
- the ability to opt in to CSS transitions for properties or values that are animatable discretely (rather than only those that are animatable continuously), and
- the ability to specify a starting style for a transition to occur when an element changes from not being rendered to being rendered.
It also improves integration with Web Animations and defines a new
interface and other rules for that integration.
Changes since the last Working Draft are listed in the Changes section.
Please send feedback by either filing an issue in GitHub (preferable) or sending mail to the (archived) public mailing list www-style@w3.org with the spec code ([css-transitions-2]
) and your comment topic in the subject line. (Alternatively, you can email one of the editors and ask them to forward your comment.)
Minutes Telecon 2023-08-30
- Resolved: Publish CSS Text 3 as a CRD
- Resolved: Accept the proposed resolution with the examples included (Issue #8318: Specified value for color when calc() is used)
- Resolved: Three longhand properties as proposed with two linked by a shorthand, names to be bikeshed, one issue for each to work them out (Issue #8829: It’s impossible to use `text-box-trim` without changing line progression within the paragraph)
- Resolved: Allow a single value for box-shadow-offset for that longhand property only (Issue #8568: Allow declaring `box-shadow-offset` with a single value)
- Resolved: We go with option 2 [add a stripe function family] and worry about composability in the future (Issue #7244: Allow stripes to be used as gradients)
Full Meeting Minutes
Minutes Telecon 2023-08-23
- Resolved: CSS Transitions 2 will have a FPWD
- Based on the discussion around issue #7387 (Providing authors with a method of opting into following the visual order, rather than logical order) the group is leaning toward removing reading-order: integer in favor of a more simplified approach. However, the newly proposed approach needs to be documented further to help work through the complications around reading order.
- Resolved: text-wrap becomes a shorthand for text-wrap-style and text-wrap-onoff, and only text-wrap-onoff is a longhand of white-space (Issue #9102: Move “balance | stable | pretty” out of text-wrap)
- Resolved: To use the actual displayed color when calculating contrast (Issue #8539: contrast-color() and gamut mapping)
- Resolved: Pursue this approach (an MVP of contrast-color()) in level 5 (Issue #9166: `contrast-color()` MVP in Level 5)
Full Meeting Minutes
Minutes Anchor Positioning Breakout 2023-08-23
- Resolved: Add border, padding, and margin properties to position fallback rules (Issue #9195: Allow more properties in position fallbacks)
- Resolved: Make the anchor-name property a comma-separated list of idents (Issue #8837: Ability for a single element to have multiple anchor names)
- Resolved: Add a separate property (can bikeshed name in future), not merely a shorthand, but interacts with inset properties in current draft (Issue #9145: Grid-based anchoring syntax?)
- Resolved: inset-area causes ‘auto’ keywords of inset to resolve to appropriate anchor() functions (TBD at computed or used value time) (Issue #9145)
- Resolved: Accept proposal in the draft with details to be worked out over time (Issue #9196: Alternative syntax for auto position fallback)
Full Meeting Minutes
Minutes Telecon 2023-08-09
- The group discussed the three options to address issue #8048 (Declarative Cross-document View Transitions) that emerged from the F2F. There was some pushback on using media queries, but not an immediate alternative so people will continue gathering ideas in the issue. Feedback on which CSS pattern to use for customization is particularly necessary.
- Resolved: Add light-dark() function that returns a color based on the color scheme (Issue #7561: Add a function to allow authors to specify colors reacting to `color-scheme`)
- Resolved: No (further) change (Issue #8629: Computed value and serialization of `Infinity` and `NaN` in color functions)
- Resolved: Close no change (Issue #8026: Add slashes between individual `border-color` values)
- Resolved: All ‘display’ values other than ‘none’ or ‘contents’ on ‘::backdrop’ compute to ‘block’ (Issue #7845: Define ::backdrop)
Full Meeting Minutes
Minutes Telecon 2023-08-02
- Resolved: We ask for CR transition for view-transitions L1 (Issue #8878: Move CSS View Transitions Level 1 to CR)
- Resolved: Add the anchor-center value (Issue #8979: Add the “centering” behavior which is now defined as an example in the specs as something built-in)
- Resolved: Define this new auto behavior for anchor-center. Bring this issue back with examples for the rest (Issue #9124: Better interaction of auto insets and self-alignment properties?)
- Resolved: Name it [the word-break value] ‘auto-phrase’ (Issue #7193: Don’t provide a language parameter for word-boundary-detection)
- Resolved: If your phrase is too long you should break at a normal word boundary rather than overflow (Issue #7193)
- Resolved: Add these four container font relative units and their functional versions to target specific containers (Issue #8855: Add container-font relative units)
- Resolved: We fix the example and tests based on it (Issue #8695: Optional values shouldn’t be serialized)
- Resolved: Remove the part about serializing calc expressions from Shapes spec (Issue #8695)
- Resolved: Restrict comparison syntax to the mf-numeric-value production, not the mf-value production (Issue #8998: Parsing strategy for range syntax)
- Resolved: Change from — to state (Issue #4805: Custom state pseudo class proposal)
Full Meeting Minutes
Minutes Telecon 2023-07-12
- Resolved: Nested relative selectors serialize with the (implied) nesting selector (Issue #8970: Define how relative selectors serialize)
- Resolved: Grouping rules with direct styles serialize them with the (implied) style rule around them (Issue #8970)
- Resolved: Change CSSStyleRule to inherit from CSSGroupingRule, modulo any discovered compat impact (Issue #8940: Why does CSSStyleRule not inherit from CSSGroupingRule?)
- Resolved: The check mentioned by Vlad occurs at computed-value time (Issue #8407: Behavior of slightly offscreen content having `content-visibility:auto` and `contain-intrinsic-size` when UA margin around the viewport is 0)
- Resolved: No containments apply to elements that don’t generate a principal box (Issue #7392: Clarify what happens when `display: contents` and `contain: style` are used together)
- Resolved: Proximity state is a property of the element (shares its lifetime) (Issue #8990: Is proximity to the viewport a property of the element or the box)
- Resolved: Proximity to the viewport is reset (returned to undefined) when the element is disconnected (Issue #8990)
- Resolved: Specify that content:none animates the same way as display:none (Issue #8623: Animation of ‘content’)
- Resolved: font-relative units resolve against the parent element when used in any font-* property (and anything else that affects font selection) (Issue #8169: Consider requiring same relative `length` units in atan2())
- Resolved: Do something similar for line-height (details TBD) (Issue #8169)
- TabAtkins will work on a proposal for how to handle custom properties typed as lengths in issue #8169
Full Meeting Minutes
Minutes Telecon 2023-06-28
- Resolved: Go with option 2, “check for only the initial value (one list item, being auto)” (Issue #6530: Should the initial value for animation-duration be auto?)
- Resolved: Adopt proposal above, background-* into css-backgrounds, border-* and box-shadow into css-borders, and box-decoration-break into css-box (Issue #7664: Split CSS Backgrounds into separate specs?)
- Resolved: Add shorthand for background-* minus background-color, name TBD (Issue #8726: Add background-layers property to set everything but background-color)
- Resolved: Remove auto() from word-boundary-detection, add keyword to word-break for this functionality (Issue #7193: Don’t provide a language parameter for word-boundary-detection)
- Munira introduced the proposal in issue #8922 (Proposal: Animating font-palette) and showed some slides to further illustrate the new functionality. Feedback and questions are welcome in the issue.
Full Meeting Minutes
Minutes Telecon 2023-06-21
- After last week’s resolution for issue #8636 (Should “Ready-made Counter Styles” be supported by UA?) there were additional concerns raised in Github about if the anchoring document is the appropriate reference. The group discussed further and decided to keep the resolution as is for now since it is better than the current state even if it’s not perfect.
- Resolved: Accept edits from the issue (Issue #8870: Korean counter styles fallback)
- Resolved: Accept edits (Issue #8186: Setting `CSSCounterStyleRule.name` should ignore symbolic counter styles)
- There was interest in solving for issue #7959 (Support automatically localized counters), but some concerns that with the hundreds of languages this would cause lots of problems as well. A more detailed proposal will be created to see if the concerns can be addressed.
- Issue #8596 (System for cjk-earthly-branch and cjk-heavenly-stem) is due to outdated tests and doesn’t need a fix.
- Resolved: Change fallback for cjk-earthly-branch and cjk-heavenly-stem to cjk-decimal instead of decimal (Issue #8975: Fallback for cjk-earthly-branch and cjk-heavenly-stem)
- Resolved: Republish CR of Counter Styles
- The group would like to do a joint meeting with WHATWG at TPAC.
Full Meeting Minutes
Minutes Telecon 2023-06-14
- Resolved: FPWD of css-anchor-positioning (Issue #8929: Request for FPWD)
- Resolved: Go with the content-box (option 2) (Issue #7661: Application of grid-positioning properties to static position of grid children is inconsistent)
- Resolved: Move mix-blend-mode behavior into the UA opacity animation (Issue #8924: Should mix-blend-mode be a part of the UA opacity animation?)
- Resolved: Accept the new behavior, put it in View Transitions 2 (Issue #8888: Hold paint of old Document until new Document draws a frame)
- Resolved: Work with i18nWG to republish Ready-Made Counter Styles as a W3C Registry allowing CSSWG and/or i18nWG to update; update Counter Styles to require everything in the Registry (Issue #8636: Should “Ready-made Counter Styles” be supported by UA?)
Full Meeting Minutes