← Ruta· Lección 8 de 9

Responsive moderno más allá de las media queries

clamp, container queries, scroll-snap y layouts que se adaptan al componente.

TODO i18n: Traducción completa del cuerpo pendiente. Título y descripción ya están localizados; el cuerpo permanece en portugués por ahora.

Media queries continuam úteis, mas o CSS moderno oferece ferramentas no nível do componente.

Ferramentas desta lição

Tipografia fluida — clamp() sem breakpoints de fonte.
Container queries — o card reage ao pai: exemplo e snippet.
Scroll-snap — carrosséis acessíveis sem lib: scroll-snap.
Colunas / mural — multi-column e grid.

Exercício

Pegue o layout com media queries e tente extrair um pedaço para @container. Depois leia o post Container queries na prática.

Próximo

Acessibilidade CSS — foco, formulários e motion.