Intern
Cuéntame sobre el último dato interesante que aprendiste sobre CSS.
sobes.tech AI
Respuesta de la IA
En CSS ha surgido una función muy interesante: las consultas de contenedor (Container Queries). Permiten aplicar estilos no solo en función del tamaño de la ventana del navegador (como en las consultas de medios), sino también del tamaño del contenedor padre. Esto es especialmente útil para crear componentes adaptativos que pueden cambiar su apariencia dependiendo de dónde se usen, y no solo del ancho de la pantalla.
Ejemplo de uso:
.card {
container-type: inline-size;
}
@container (min-width: 400px) {
.card {
background-color: lightblue;
}
}
Aquí, .card se convierte en un contenedor, y sus estilos cambian si el ancho del contenedor es mayor a 400px. Esto abre nuevas posibilidades para un diseño modular y adaptable.