This commit is contained in:
realaravinth
2021-05-09 18:59:23 +05:30
parent 686774a182
commit 7792d5ccc7
14 changed files with 55 additions and 23 deletions

View File

@@ -18,13 +18,8 @@
// creadits: https://codepen.io/rachelandrew/pen/MmOvPr/?editors=1100
.layout {
display: grid;
grid-template-columns: 1fr 5fr;
grid-template-rows: 1fr 6fr 1fr;
}
h1,
p {
margin: 0 0 1em 0;
grid-template-columns: minmax(250px, auto) 1fr;
grid-template-areas: 'navbar mainContent';
}
/* no grid support? check this out later */
@@ -41,17 +36,27 @@ p {
*/
/* make a grid */
header,
footer {
grid-column: 2 / 5;
/* needed for the floated layout */
clear: both;
}
//header,
//footer {
// grid-column: 2 / 5;
// /* needed for the floated layout */
// clear: both;
//}
nav {
grid-row: 1/ 4;
// grid-row: 1/ 4;
/* needed for the floated layout */
clear: both;
grid-area: navbar;
height: 100%;
}
.tmp-layout {
// grid-column: 2 / 5;
grid-area: mainContent;
max-height: 100%;
display: flex;
flex-direction: column;
}
/* We need to set the widths used on floated items back to auto, and remove the bottom margin as when we have grid we have gaps.