.dashboard { display: grid; }Panourile directe intră în același context Grid.
LECȚIA 61 DIN 100
Creează primul container Grid
Activează un sistem de layout bidimensional pentru un grup de panouri.
PASUL 1 · ÎNVAȚĂ
Cum funcționează
display: grid transformă elementul într-un container Grid. Copiii direcți devin elemente Grid și pot fi așezați pe rânduri și coloane, fără schimbarea ordinii semantice din HTML.
.dashboard { display: block; }block păstrează fluxul obișnuit și nu creează rânduri sau coloane Grid.
PASUL 2 · APLICĂ
Exercițiul tău
Transformă .dashboard într-un container Grid.
index.htmlCSS
Rezultat sigurizolat
Ciorna se păstrează doar în acest browser.HTML și CSS permise · scripturile și rețeaua sunt blocate
PASUL 4 · VERIFICĂ
Ce trebuie să treacă
0%neverificat
- ○Panoul folosește display: grid.
- ○Elementul țintă este prezent în pagină.
Explică-mi logica rezolvării
Proprietatea display stabilește modelul de layout, iar valoarea grid activează cele două dimensiuni ale grilei.