Definición de .justify-content en CSS
La propiedad .justify-content
es una subproperiedad del módulo de diseño de caja flexible.
Ejemplo de uso : propiedad CSS justify-content
Esta propiedad de CSS normalmente se utiliza de la siguiente manera:
justify-content: flex-start | flex-end | center | space-between | space-around | space-evenly
.flex-item {
justify-content: center;
}
Otro ejemplo más avanzado de .justify-content es el siguiente de CODEPEN:
Sintaxis de .justify-content en CSS
justify-content: flex-start|flex-end|center|space-between|space-around|space-evenly|initial|inherit;
Valores
Valor | Descripción | Juegalo |
---|---|---|
arranque flexible | Valor por defecto. Los elementos se colocan al principio del contenedor. | |
extremo flexible | Los artículos se colocan al final del contenedor. | |
centro | Los artículos se colocan en el centro del contenedor. | |
espacio entre | Los artículos tendrán espacio entre ellos. | |
espacio alrededor | Los elementos tendrán espacio antes, entre y después de ellos | |
uniformemente en el espacio | Los elementos tendrán el mismo espacio a su alrededor. | |
inicial | Establece esta propiedad en su valor predeterminado. | |
heredar | Hereda esta propiedad de su elemento principal. |
Exploradores compatibles con .justify-content
Los números de la tabla especifican la primera versión del navegador que es plenamente compatible con la propiedad.
Los números seguidos de -webkit- detallan la primera versión que funcionó con un prefijo.
Property | Chrome | Internet Explorer / Edge | Firefox | Safari | Opera |
---|---|---|---|---|---|
left | 1.0 | 5.5 | 1.0 | 1.0 | 5.0 |