FlexBoxFroggy: Aprende a maquetas Webs en Flexbox mientras juegas
Accede a su web aquí: http://flexboxfroggy.com/
En qué consiste FlexBox?
Flexbox lleva ya tiempo funcionando, pero su sintaxis ha cambiado varias veces.
El objetivo de FlexBox es crear un modelo de caja o contenedor optimizado para los distintos dispositivos que usan los usuarios de una web. En CSS 2.1 se establecieron cuatro formas de crear una caja: block, inline, table y position. Ahora se crea un modelo de caja nuevo, la caja flexible o FlexBox con display: flex
.
Funciona ajustando los tamaños y la disposición de los elementos que se encuentran dentro de un contenedor o caja, de tal manera que se adapten siempre al espacio disponible. Permite posicionar dichos elementos internos con gran facilidad, de manera independiente al orden en el que aparezcan en el código.