diff --git a/templates/main.css b/templates/main.css index bf74678..ae4aadf 100644 --- a/templates/main.css +++ b/templates/main.css @@ -8,6 +8,8 @@ h1, h2, h3, h4, h5 { body { display: flex; + width: 99vw; + margin: 0 auto; } img { @@ -27,27 +29,19 @@ aside h1 { font-variant: small-caps; } -main { - flex-grow: 1; -} - -nav, main { - padding: 0 2em; -} - @media screen and (max-width: 800px) { body { flex-direction: column-reverse; } - + nav, main { + padding: 0 2em; + } aside { border-top: 1px solid gray; } - aside h1 { text-align: center; } - aside li { display: inline-block; } @@ -56,13 +50,21 @@ nav, main { @media screen and (min-width: 800px) { aside { display: flex; + flex: 0 0 18vw; flex-direction: column; justify-content: space-between; - min-width: 15em; - width: 15em; min-height: 100vh; border-right: 1px solid gray; } + nav { + padding: 0 1em; + } + main { + padding: 0 2em; + flex-grow: 1; + /* god dammit flexbox */ + min-width: 1px; + } } nav ul {