Use Flexbox for excerpt layout
This commit is contained in:
@@ -1,4 +1,7 @@
|
||||
.excerpt {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
flex-grow: 1;
|
||||
border-bottom: 1px solid var(--color-light-grey);
|
||||
margin-bottom: var(--space-sm);
|
||||
padding-bottom: var(--space-sm);
|
||||
@@ -17,6 +20,10 @@
|
||||
margin-bottom: var(--space-xs);
|
||||
}
|
||||
|
||||
.excerpt__body {
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
@media (--viewport-md) {
|
||||
.excerpt__head,
|
||||
.excerpt__body,
|
||||
|
||||
15
css/page.css
15
css/page.css
@@ -87,17 +87,14 @@
|
||||
grid-template-rows: 32px 162px 1fr;
|
||||
}
|
||||
|
||||
.page__content--2col {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: var(--space-md);
|
||||
}
|
||||
|
||||
.page__content-item {
|
||||
.page__columns {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
|
||||
.page__content-item--full-width {
|
||||
grid-column: 1 / -1;
|
||||
.page__cell {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
flex: 1 0 50%;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user