En la séptima clase del curso de Flexbox, aprenderemos a alterar el crecimiento de nuestros ítems flexibles fácilmente.
En este momento ya sabemos cómo definir el tamaño de nuestros elementos flexibles albergados dentro de un contenedor flex. Sin embargo, si modificamos el tamaño del viewport, dicho tamaño se mantiene completamente inalterado.
¿Es posible que realmente queramos eso, sin embargo, ¿qué pasa si queremos que éste se modifique? ¡Claro! Flexbox nos provee de un par de propiedades que nos permiten precisamente eso, modificar el tamaño de los ítem flex en función del viewport. ¡Vamos a verlo!
¡Hecho! ¿Has visto el potencial de la propiedad de factor de crecimiento? Ya podemos trabajar el crecimiento de los distintos elementos en relación a los otros ítem flexibles.
Ahora, tenemos el poder de modificar los distintos elementos en conjunto, o uno a uno de forma independiente, en función del tamaño del viewport. Es decir, que dichos elementos se mostrarán de un modo u otro en función de la pantalla que el usuario utilice para visualizar el contenido… ¡Y sin la necesidad de tirar de media queries! O_O'
Algo realmente interesante, para poder adaptar el contenido de nuestro sitio web al dispositivo que se utilice para acceder al mismo. Hoy os proponemos a aplicarlo en vuestro proyecto, y si necesitáis ayuda, os dejamos el código debajo del vídeo ;)
Recuerda que si tienes cualquier duda acerca de lo contado en esta lección, tienes a tu disposición la pestaña de soporte de la intranet :) ¡Nos vemos!
Todos los capítulos de este curso:
- Curso de Flexbox #1. Introducción
- Curso de Flexbox #2. Dirección
- Curso de Flexbox #3. Filas
- Curso de Flexbox #4. Alineación
- Curso de Flexbox #5. Orden
- Curso de Flexbox #6. Tamaño
- Curso de Flexbox #7. Factor de crecimiento
- Curso de Flexbox #8. Factor de decrecimiento
- Curso de Flexbox #9. Alineación particular
- Curso de Flexbox #10. Layout con Flexbox