Change navbar css so that links wrap in header on narrow windows

Previously, all of these links would drop beneath the header,
making the navigation difficult to use, as it would become white
links on an off-white background.
This commit is contained in:
Tyler Dence 2017-06-22 09:15:33 -04:00 committed by Tyler Dence
parent fb9af2def6
commit fc4b2fba89
2 changed files with 6 additions and 6 deletions

View File

@ -5,7 +5,7 @@
*/
/* container for the entire bar */
#archnavbar { height: 40px !important; padding: 10px 15px !important; background: #333 !important; border-bottom: 5px #08c solid !important; }
#archnavbar { min-height: 40px !important; padding: 10px 15px !important; background: #333 !important; border-bottom: 5px #08c solid !important; }
#archnavbarlogo { background: url('archlogo.png') no-repeat !important; }
/* move the heading/paragraph text offscreen */
@ -16,8 +16,8 @@
#archnavbarlogo a { display: block !important; height: 40px !important; width: 190px !important; }
/* display the list inline, float it to the right and style it */
#archnavbar ul { display: inline !important; float: right !important; list-style: none !important; margin: 0 !important; padding: 0 !important; }
#archnavbar ul li { float: left !important; font-size: 14px !important; font-family: sans-serif !important; line-height: 45px !important; padding-right: 15px !important; padding-left: 15px !important; }
#archnavbar ul { display: block !important; list-style: none !important; margin: 0 !important; padding: 0 !important; font-size: 0px !important; text-align: right !important; }
#archnavbar ul li { display: inline-block !important; font-size: 14px !important; font-family: sans-serif !important; line-height: 14px !important; padding: 14px 15px 0px !important; }
/* style the links */
#archnavbar ul#archnavbarlist li a { color: #999; font-weight: bold !important; text-decoration: none !important; }

View File

@ -13,7 +13,7 @@
*/
/* container for the entire bar */
#archnavbar { height: 40px !important; padding: 10px 15px !important; background: #333 !important; border-bottom: 5px #08c solid !important; }
#archnavbar { min-height: 40px !important; padding: 10px 15px !important; background: #333 !important; border-bottom: 5px #08c solid !important; }
#archnavbarlogo { float: left !important; margin: 0 !important; padding: 0 !important; height: 40px !important; width: 190px !important; background: url('archnavbar/archlogo.png') no-repeat !important; }
@media (-webkit-min-device-pixel-ratio: 1.2), (min--moz-device-pixel-ratio: 1.2), (-o-min-device-pixel-ratio: 2/1) {
#archnavbarlogo { float: left !important; margin: 0 !important; padding: 0 !important; height: 40px !important; width: 190px !important; background: url(archnavbar/archlogo.svg) no-repeat !important;background-size:100% !important;
@ -27,8 +27,8 @@
#archnavbarlogo a { display: block !important; height: 40px !important; width: 190px !important; }
/* display the list inline, float it to the right and style it */
#archnavbarlist { display: inline !important; float: right !important; list-style: none !important; margin: 0 !important; padding: 0 !important; }
#archnavbarlist li { float: left !important; font-size: 14px !important; font-family: sans-serif !important; line-height: 45px !important; padding-right: 15px !important; padding-left: 15px !important; }
#archnavbarlist { display: block !important; list-style: none !important; margin: 0 !important; padding: 0 !important; font-size: 0px !important; text-align: right !important; }
#archnavbarlist li { display: inline-block !important; font-size: 14px !important; font-family: sans-serif !important; line-height: 14px !important; padding: 14px 15px 0px !important; }
/* style the links */
#archnavbarlist li a { color: #999; font-weight: bold !important; text-decoration: none !important; }