app/assets/stylesheets/layout.scss
body {
display: flex;
flex-direction: column;
min-height: 100vh;
main {
width: 100%;
margin: 48px auto 0 auto;
padding-bottom: $baseline * 3;
flex: 1;
@media #{$mobile} {
margin-top: $baseline;
}
#columns_header {
max-width: $site_max_width;
box-sizing: border-box;
padding: 0 $baseline * 1.5;
margin-left: auto;
margin-right: auto;
margin-bottom: $baseline * 1.5;
}
#columns {
display: flex;
max-width: $site_max_width;
box-sizing: border-box;
padding: 0 $baseline * 1.5;
margin-right: auto;
margin-left: auto;
@media #{$one-column} {
display: block;
}
@media #{$mobile} {
padding-right: 0;
padding-left: 0;
}
> div {
min-width: 320px;
flex: 1;
&#left {
margin-right: $baseline * 0.75;
}
&#right {
margin-left: $baseline * 0.75;
}
@media #{$one-column} {
width: 100%;
margin-left: auto !important;
margin-right: auto !important;
}
}
}
}
}