contain-intrinsic-height
Sets the placeholder height for an element under size containment. It ensures the element occupies space even if its content isn't being rendered yet.
It is documented as part of the CSS Box Sizing specification.
Syntax
/* Usage Example */
.lazy-card {
content-visibility: auto;
/* Reserves space to prevent page jumping */
contain-intrinsic-height: 300px;
}
/* Syntax */
contain-intrinsic-height: auto;
contain-intrinsic-height: none;
/* Global values */
contain-intrinsic-height: inherit;
contain-intrinsic-height: initial;
contain-intrinsic-height: revert;
contain-intrinsic-height: revert-layer;
contain-intrinsic-height: unset;
contain-intrinsic-height Browser support
Newly available
Since
2023 93% global usage
Since 2023 this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
95+
107+
17+
95+