Uvod v CSS mreže
CSS mreže predstavljajo način za postavitev elementov hkrati vodoravno in navpično. To je naprednejši način v primerjavi s fleksi, vendar bolj zapleten za obvladovanje.
Če želite ustvariti mrežo, morate nastaviti
lastnost display
elementa na vrednost grid:
<div id="parent">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
#parent {
display: grid;
}
Po tem se element spremeni v dvodimenzionalno mrežo, v kateri so elementi razporejeni navpično (stolpci) in vodoravno (vrstice). Območje na presečišču stolpca in vrstice se imenuje celica.
S posebnimi lastnostmi lahko postavljamo elemente po vrsticah in stolpcih. To bo omogočilo enostavno ustvarjanje, na primer, takšnih stvari:
V naslednjih lekcijah bomo najprej preučili postavitev elementov po stolpcih, nato pa prešli k preučevanju vrstic, in na koncu vse to združili skupaj.