transition-behavior
Allows you to enable transitions for properties that normally switch instantly, like 'display'. By setting it to 'allow-discrete', you can create entry and exit animations for elements that are removed from the DOM or hidden.
Quick example
dialog {
transition: display 0.5s, overlay 0.5s, opacity 0.5s;
/* Enables smooth transitions for the 'display' property */
transition-behavior: allow-discrete;
}Quick facts
Initial value
normalInherited
No
Applies to
all elements
Animation type
notAnimatable
transition-behavior Browser Support
Newly available Since 2024 87% global usage
Since 2024 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
Works in all modern browsers. May need a fallback for older browsers.
117+
129+
17.4+
117+