1
HTML/CSSIntermediate#css#performance
HTML/CSSAdvanced#css#responsive#container-queries
What are container queries and how do they differ from media queries?
Media queries respond to the viewport size, while container queries (@container) respond to the size of a specific parent container, allowing a component to adapt its styles based on the space it's actually given, regardless of overall screen size — essential for reusable component libraries.
Example
.card-container { container-type: inline-size; container-name: card; }
@container card (min-width: 400px) {
.card { flex-direction: row; }
}