[Zian]

Mam pytanie odnośnie CSS Grid.

Jest element HEADER, który zaczyna się od linii 1 i kończy na linii 5:

header {
grid-column: 1 / 5;
grid-row: 1 / 2;
}

HEADER rozciąga się od lewej do prawej na całej szerokości:

.wrapper {
display: grid;
grid-template-columns: auto 700px 300px auto;
grid-template-rows: 100px auto 200px;
min-height: 100vh;
}

Pytanie brzmi: Czy da się, aby np. element NAV będący blokiem rozciągał się tylko od linii 2 do linii 4 będąc wewnątrz HEADER?

#webdevhelp #css #html #webdev #webdesign

[doee]

@Zian: Tak, ale wtedy header musi mieć właściwość display: grid;.

[Zian]

@doee: Danks.

Zrobiłem tak:

#wrapper {
 display: grid;
 grid-template-columns: auto 700px 300px auto;
 grid-template-rows: 100px auto 200px;
 background:#100;
}

header {
 display: grid;
 grid-column: 1 / 5;
 grid-row: 1 / 2;
 grid-template-columns: subgrid;
 grid-template-rows: subgrid;
 background:#200;
}

nav {
 grid-column: 2 / 4;
 grid-row: 1 / 2;
 background:#320;
}