No edit summary |
No edit summary |
||
| Line 35: | Line 35: | ||
grid-template-columns: 1fr 1fr; | grid-template-columns: 1fr 1fr; | ||
grid-template-rows: auto; | grid-template-rows: auto; | ||
gap: | gap: 0.8em 0.8em; | ||
grid-auto-flow: row; | grid-auto-flow: row; | ||
grid-template-areas: | grid-template-areas: | ||
Revision as of 15:24, 10 March 2022
/* CSS placed here will be applied to all skins */
.box {
display: inline-block;
border: 1px solid #d9d9d9;
border-radius: 10px 10px 0 0;
background-color: #fff;
}
/* Removed - width: 100%; */
.box .box-header {
display: block;
clear: both;
margin: 0;
border-top: 1px solid #fff;
border-bottom: 1px solid #d9d9d9;
border-radius: 10px 10px 0 0;
background-color: #f2f2f2;
padding: 8px 20px;
overflow: hidden;
}
.mp-bordered {
margin-bottom: 0.4em;
padding: 0.4em;
border-width: 1px;
border-style: solid;
border-color: #ddd;
background-color: #f9f9f9;
overflow: auto;
}
/* Removed - white-space: nowrap; */
.container { display: grid;
grid-template-columns: 1fr 1fr;
grid-template-rows: auto;
gap: 0.8em 0.8em;
grid-auto-flow: row;
grid-template-areas:
"Banner Banner"
"Intro Intro"
"Featured Contents"
"Lore FAQ"
". .";
}
.Banner { grid-area: Banner; }
.Intro { grid-area: Intro; }
.Featured { grid-area: Featured; }
.Contents { grid-area: Contents; }
.Lore { grid-area: Lore; }
.FAQ { grid-area: FAQ; }