contain-intrinsic-size
A shorthand property to set both the width and height an element should 'pretend' to have when it is under size containment. This is a game-changer for scroll performance.
Quick example
section {
content-visibility: auto;
/* Reserves 100% width and 400px height */
contain-intrinsic-size: 100% 400px;
}Quick facts
Initial value
See individual propertiesInherited
No
Applies to
elements for which size containment can apply
Values
autononecontain-intrinsic-size Browser Support
Widely availableSince 202394% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2023.
Safe to use without fallbacks.
83+
107+
17+
83+