layout
Container query
CSS that lets a component respond to the size of its own containing box, rather than the size of the whole browser window.
Traditional media queries respond to the viewport – the whole window. The problem: a card in a wide main column and the same card in a narrow sidebar need different layouts, and a media query can’t tell the difference because the window is the same size in both cases.
Container queries (supported in all major browsers) fix exactly this: the component reads its own container’s width and reflows accordingly. The same card works everywhere without special-casing where it’s placed. This is the current-generation shift in responsive layout – the deeper treatment lives in the viewports course when it ships.