diff options
| -rw-r--r-- | common.css | 14 | ||||
| -rw-r--r-- | web.css | 2 | ||||
| -rw-r--r-- | web.xhtml | 10 |
3 files changed, 13 insertions, 13 deletions
@@ -62,11 +62,9 @@ body {min-width: 17em;} #header-logo {text-align: left;} #header-menu {text-align: right;} -/* These overlap with #header's padding, FSR. To make this work when -menu is - flexbox, we have to add this padding to its children so they don't touch - the browser frame. Don't you just love web development? */ -#header-logo {padding-left: .4em;} -#header-menu a {margin-right: .45em;} /* Font size adjustment. */ +/* These overlap with #header's padding when no margin left, FSR. */ +#header-logo {padding-left: .25em;} +#header-menu {padding-right: .25em;} #header-menu a { @@ -86,7 +84,7 @@ body {min-width: 17em;} } /* Flexbox-based improvements though the above works reasonably well. */ -#header-menu +#header-menu-body { width: 100%; @@ -94,7 +92,7 @@ body {min-width: 17em;} display: inline-flex; -webkit-flex-flow: row wrap; - flex-flow: row wrap; + flex-flow: row wrap; -webkit-justify-content: flex-end; justify-content: flex-end; @@ -104,7 +102,7 @@ body {min-width: 17em;} /* @media only screen and (max-width: 567px) { - #header-menu + #header-menu-body { -webkit-flex-direction: column; flex-direction: column; @@ -13,7 +13,7 @@ @media only screen and (max-width: 567px) { - #header-menu + #header-menu-body { -webkit-flex-direction: column; flex-direction: column; @@ -17,10 +17,12 @@ <div id="header"> <div id="header-logo"><code>b2</code></div> <div id="header-menu"> - <a href="/">Documentation</a> - <a href="/">Download</a> - <a href="/">Mailing Lists</a> - <a href="/">C++ Packages</a> + <div id="header-menu-body"> + <a href="/">Documentation</a> + <a href="/">Download</a> + <a href="/">Mailing Lists</a> + <a href="/">C++ Packages</a> + </div> </div> </div> </div> |