Nav Menu Not Centering
-
I’ve been trying to get my drop-down navigation menu centered under my logo/over the body text for literally weeks now. I’ve got it to appear correct now on Chrome for Android, but not in Firefox, Chrome, or Firefox for Android. It’s off to the left. I know there are a zillion posts on this very topic, but after trying every idea I’ve found to no avail, it’s clear to me that I need some specific help. So much appreciation for anyone who can help me!
https://www.leenb.com
Here’s the CSS:
#access {
border-bottom: none;
height:34px;
font-size:16px;
text-transform: uppercase;
width: 50%;
margin: 0 auto;}/*** NAV MENU STYLE ***/
.sf-menu a:link {#000000;}
.sf-menu a, .sf-menu a:visited {color: #000;}
.sf-menu li {
float:left;
position:relative;}
.sf-menu {
float:left;
margin-left:1px;}
.sf-menu a {
border-color:#fff;
border-style:none;
border-width:0px;
padding:9px 13px;
text-decoration:none;
margin-left:-1px;}
.sf-menu a, .sf-menu a:visited { /* visited pseudo selector so IE6 applies text colour*/
color:#9e9e9e;}
.sf-menu li {
background:#fff;}
.sf-menu li li {
background:#fff;}
.sf-menu li li li {
background:#FFF;}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
background:#fff;
outline: 0;
border-bottom-color:#FFF;}
border-bottom:0px solid #9e9e9e;}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
top:34px; /* overriding essential styles */}
.sf-menu ul ul {
margin-top:0;}
.sf-menu ul a {
background:#fff;
border-bottom:none;}
.sf-menu ul a:hover {
color: #000;}#menu {
width:960px;
margin:0 auto;
border: none;
position: static; top: 10px; right: 10px;}
#main {
width:960px;
margin:0 auto;
padding: 40px 0 22px;
overflow:visible;
position:relative;}
#main-nav .nav > li > a:hover, #main-nav .nav > li.dropdown.open > a, #main-nav .nav > li.current-menu-item > a, #main-nav .nav > li.current-menu-parent > a, #main-nav .nav > li.current-menu-ancestor > a {
background-color: #666666;}#container {
width:960px;
float:left;
margin:0 0 0 10px;}
#content {
margin: 0 240px;
overflow:visible;}
- The topic ‘Nav Menu Not Centering’ is closed to new replies.