Style justifyContent eigenschap

Definitie en gebruik

Als items niet alle beschikbare ruimte op de hoofdas (horizontaal) gebruiken: justifyContent Stelt items uitlijnen van een elastische container in.

Tip:Gebruik alignContent Stelt items in op het horizontale as (verticaal) uitlijnen.

Zie ook:

CSS Referentiesjustify-content eigenschap

Voorbeeld

Laat wat ruimte tussen de items van een elastische <div> element.

document.getElementById("main").style.justifyContent = "space-between";

Probeer het zelf uit

Syntaxis

Retourneren van de justifyContent eigenschap:

object.style.justifyContent

Instellen van de justifyContent eigenschap:

object.style.justifyContent = "flex-start|flex-end|center|space-between|space-around|initial|inherit"

Eigenschapswaarde

Waarde Beschrijving
flex-start Standaardwaarde. Items zijn aan het begin van de container geplaatst.
flex-end Items zijn aan het einde van de container geplaatst.
center Items zijn in het midden van het container geplaatst.
space-between Laat ruimte voor items tussen de regels.
space-around Laat ruimte voor items voor, tussen en achter de regels.
initial Stel deze eigenschap in op zijn standaardwaarde. Raadpleeg initial.
inherit Deze eigenschap erft deze eigenschap van zijn ouder-element. Raadpleeg inherit.

Technische details

Standaardwaarde: flex-start
Retourwaarde: een string die de justify-content eigenschap.
CSS versie: CSS3

Browserondersteuning

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Ondersteund 12.0 Ondersteund 9.0 Ondersteund

Gerelateerde pagina's

HTML DOM STYLE ReferentiesalignContent eigenschap

HTML DOM STYLE ReferentiesalignItems eigenschap

HTML DOM STYLE ReferentiesalignSelf attribute