Propiedad alignContent de estilo
Ejemplo
Coloque los elementos del elemento <div> flexible con espacio entre líneas:
document.getElementById("main").style.alignContent = "space-between";
Definición y uso
La propiedad alignContent alinea los elementos del contenedor flexible cuando los elementos no utilizan todo el espacio disponible en el eje transversal (verticalmente).
Sugerencia: use la propiedad justificar contenido para alinear los elementos en el eje principal (horizontalmente).
Nota: Debe haber varias líneas de elementos para que esta propiedad tenga algún efecto.
Compatibilidad con navegador
Los números de la tabla especifican la primera versión del navegador que es totalmente compatible con la propiedad.
Los números seguidos de Webkit especifican la primera versión que funcionó con un prefijo.
Property | |||||
---|---|---|---|---|---|
alignContent | 21.0 | 11.0 | 28.0 | 9.0 7.0 Webkit |
12.1 |
Sintaxis
Devuelve la propiedad alignContent:
object.style.alignContent
Establezca la propiedad alignContent:
object.style.alignContent = "stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit"
Valores de propiedad
Value | Description |
---|---|
stretch | Default value. Items are stretched to fit the container |
center | Items are positioned at the center of the container |
flex-start | Items are positioned at the beginning of the container |
flex-end | Items are positioned at the end of the container |
space-between | Items are positioned with space between the lines |
space-around | Items are positioned with space before, between, and after the lines |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Detalles técnicos
Valor por defecto: | tramo |
---|---|
Valor devuelto: | Una cadena, que representa la propiedad de contenido de alineación de un elemento |
Versión CSS | CSS3 |
páginas relacionadas
Referencia de CSS: propiedad de alineación de contenido
Referencia HTML DOM STYLE: propiedad alignItems
Referencia HTML DOM STYLE: propiedad alignSelf
Referencia de HTML DOM STYLE: propiedad allowContent