Add basic layout using css grids
This commit is contained in:
parent
545c55ab3f
commit
955e080bb5
1 changed files with 31 additions and 0 deletions
|
@ -0,0 +1,31 @@
|
||||||
|
body {
|
||||||
|
background-color: #eebebe;
|
||||||
|
|
||||||
|
display: grid;
|
||||||
|
grid-template:
|
||||||
|
"head head"
|
||||||
|
"nav main"
|
||||||
|
"nav foot";
|
||||||
|
}
|
||||||
|
|
||||||
|
header {
|
||||||
|
grid-area: head;
|
||||||
|
}
|
||||||
|
|
||||||
|
aside {
|
||||||
|
background-color: #e3e3e3;
|
||||||
|
|
||||||
|
width: 250px;
|
||||||
|
|
||||||
|
grid-area: nav;
|
||||||
|
}
|
||||||
|
|
||||||
|
article {
|
||||||
|
background-color: #e3e3e3;
|
||||||
|
grid-area: main;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
grid-area: foot;
|
||||||
|
}
|
||||||
|
|
Loading…
Add table
Reference in a new issue