summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorBoris Kolpackov <boris@codesynthesis.com>2016-01-30 19:01:39 +0200
committerBoris Kolpackov <boris@codesynthesis.com>2016-01-30 19:01:39 +0200
commitcacc05431f8b243e8cd94aba3910d8e5680dfe6d (patch)
tree1fc034a2d3d02d9e8984e6337451da1bc5d2418a
parent66f2b7c6775e06487116425f120ce6bce5d2af81 (diff)
Fix menu bar alignment issues
-rw-r--r--common.css14
-rw-r--r--web.css2
-rw-r--r--web.xhtml10
3 files changed, 13 insertions, 13 deletions
diff --git a/common.css b/common.css
index 83c8f6a..2418574 100644
--- a/common.css
+++ b/common.css
@@ -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;
diff --git a/web.css b/web.css
index 507875e..0d2fdf3 100644
--- a/web.css
+++ b/web.css
@@ -13,7 +13,7 @@
@media only screen and (max-width: 567px)
{
- #header-menu
+ #header-menu-body
{
-webkit-flex-direction: column;
flex-direction: column;
diff --git a/web.xhtml b/web.xhtml
index a701d59..12f4dff 100644
--- a/web.xhtml
+++ b/web.xhtml
@@ -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>