dairydemon.net
located several wrong turns off the Information Superhighway
diff --git a/styles/default.css b/styles/default.css index 9e2a0a5..83bdc61 100644 --- a/styles/default.css +++ b/styles/default.css @@ -6,19 +6,15 @@ html { min-height: 100%; } -header, -footer, -article, -main nav { - border: 3px black solid; +body { background: turquoise; - margin: 5px; - box-shadow: 2px 2px 2px; + max-width: 80ch; + margin: 0 auto; } /* header and footer */ header { - text-align: center; + padding: 1rem; } #homelink { @@ -68,30 +64,7 @@ ol ol ol { } @media screen and (min-width: 80ch) { - /* to avoid zoom issues, grid layout is only used when mid-width is - * large enough */ body { - display: grid; - justify-content: center; - } - - main { - /* min-width is set due to zoom issues */ - min-width: 100%; - display: flex; - align-items: start; - } - - main nav { - flex: auto; - position: sticky; - top: 10px; - } - - article { - /* width is set for the about page */ - width: 80ch; - max-width: 80ch; - flex: auto; + border: 3px black solid; } } diff --git a/styles/index.css b/styles/index.css index ad56a63..06e3fb5 100644 --- a/styles/index.css +++ b/styles/index.css @@ -1,8 +1,6 @@ /* header and footer */ header { - display: flex; - align-items: center; - flex-flow: wrap; + padding: 0; } footer { @@ -10,16 +8,11 @@ footer { } #headerimg { - border-right: 3px solid black; - width: 128px; - background-image: url("/images/watching.jpg"); - flex: initial; - align-self: stretch; + float: right; } #headermain { - text-align: center; - flex: auto; + padding: 1rem; } #headermain a {