Flexbox & FontAwesome & Gradientes

Wrap

nowrap

nowrap contiene un valor por defecto (omision): flex-direction: row;

todos los items flex van a estar en una sola linea

wrap

todos los items se envuelven en multiples lineas

wrap-reverse

todos los items se envuelven en multiples lineas desde abajo hacia arriba

justify-content

flex-start

flex-start contiene un valor por defecto (omision): justify-content: flex-start;

Agrupa (junta o empaqueta) los elementos al inicio del contenedor

flex-end

Los items se empaquetan hacia el final de la dirección flex

flex-center

Los items se empaquetan hacia el centro de la linea

space-between

los items se distribuyen en la linea, el primero al inicio y el ultimo al final, distribuido proporcionalmente entre medio

space-around

los items se distribuyen el la linea y el espacio proporcionalmente entre los elemntos, pero al inicio y al final utiliza un medida de espacio y entre medio dos medidas

space-evenly

los items se distribuyen en la linea y el espacio lo distribuye proporcionalmente

align-items

define el comportamiento de los items flex en el eje transversal (que corta al eje principal, perpendicular)

flex-start

alinea los items al inicio del eje perpendicular

flex-end

alinea los items al final

center

alinea los items al centro

baseline

los items se alinean sobre la linea base

stretch

los items se alargan para llenar el contenedor (se estiran)

flex-direction

establece la dirección sobre el eje principal.

row

row-reverse

column

column-reverse