container-type
Defines an element as a 'container' so its children can query its size or state. 'inline-size' is the most common value, allowing responsive styles based on the container's width.
Quick example
.parent {
/* Turns this element into a container for its children to query */
container-type: inline-size;
}
Quick facts
Initial value
normalInherited
No
Applies to
all elements
Animation type
color
Values
normalsizeinline-sizescroll-statecontainer-type Browser Support
Widely availableSince 202393% 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.
105+
110+
16+
105+