Guía Completa de Flexbox
Contenedor Flex
Convierte un contenedor en Flexbox.
Elemento 1
Elemento 2
Elemento 3
display: flex;
Justify Content
Alinea elementos horizontalmente.
Elemento 1
Elemento 2
Elemento 3
justify-content: center;
Align Items
Alinea elementos verticalmente.
Elemento 1
Elemento 2
Elemento 3
align-items: center;
Flex Direction
Cambia la dirección del flujo de los elementos.
Elemento 1
Elemento 2
Elemento 3
flex-direction: column;
Flex Wrap
Permite que los elementos ocupen múltiples líneas.
Elemento 1
Elemento 2
Elemento 3
Elemento 4
Elemento 5
flex-wrap: wrap;
Gap
Agrega espacio entre los elementos.
Elemento 1
Elemento 2
Elemento 3
gap: 20px;
Order
Cambia el orden visual de los elementos.
Elemento 1
Elemento 2
Elemento 3
order: [valor];