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:
parent
fb9af2def6
commit
fc4b2fba89
@ -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; }
|
||||
|
@ -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; }
|
||||
|
Loading…
Reference in New Issue
Block a user