← Trilha· Lição 8 de 9
Responsivo moderno além das media queries
clamp, container queries, scroll-snap e layouts que se adaptam ao componente.
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.