Eigenschap grid-auto-rows
De eigenschap grid-auto-rows bepaalt
het aantal en de breedte van de rijen die
een element in het impliciete grid zal innemen.
Impliciet grid - een grid dat automatisch wordt
gemaakt wanneer elementen buiten de
grenzen van het reeds gedefinieerde grid vallen.
In de waarde van de eigenschap specificeren we de breedte van de rijen
in willekeurige eenheden
voor afmetingen.
De eigenschap wordt gespecificeerd in het ouder-element
en bepaalt de breedte van de rijen van de kind-elementen.
Syntaxis
selector {
grid-auto-rows: rijbreedte;
}
Voorbeeld
Laten we de breedte van de rijen voor onze elementen in het impliciete grid instellen:
<div id="parent">
<div id="elem1">1</div>
<div id="elem2">2</div>
<div id="elem3">3</div>
<div id="elem4">4</div>
<div id="elem5">5</div>
</div>
#parent {
display: grid;
grid-template-columns: 100px 200px;
grid-auto-rows: 40px 60px 80px;
border: 2px solid #696989;
padding: 10px;
}
#parent > div {
padding: 10px;
border: 1px solid #696989;
}
:
Zie ook
-
de eigenschap
grid-auto-columns,
die het aantal en de breedte van kolommen in het impliciete grid bepaalt -
de eigenschap
grid-template-rows,
die het aantal en de breedte van rijen in het grid bepaalt
