CSS · At-rules, values and responsive design

@container

Styles children based on the size of their container rather than the viewport.

cssRunnable example css course

Syntax

@container (min-width: 20rem) { … }

Example

Try it

.demo { container-type: inline-size; } @container (min-width: 200px) { .demo { background: #eef6ff; } }

Reference pages are the quick answer. The course explains the why, shows the full example and ends with a challenge.