WordPress.org

Support

Support » How-To and Troubleshooting » Centering Navigation

Centering Navigation

  • I am having all sorts of trouble centering my links in the navigation bar (under the header). I’ve tried the text:align (center), but am still having no luck. I’m working on a local machine so the site’s not live. Any thoughts on how to do this, and also on the child navigational links that are on the second tier (horizontal), would be deeply appreciated.

    Here’s the code (hope it’s not too long for this):

    #nav {
    	display: block;
    	float: right;
    	width: 924px;
    	background-color: #410013;
    	height: 40px;
    	margin-right: 0px;
    	margin-bottom: 0px;
    	border-right-width: 8px;
    	border-left-width: 8px;
    	border-right-style: solid;
    	border-left-style: solid;
    	border-right-color: #FFF;
    	border-left-color: #FFF;
    	margin-left: 0px;
    	}
    
    #nav li {
    	margin-right:25px;
    	padding-top: 10px;
    	padding-right: 10px;
    	padding-bottom: 10px;
    	padding-left: 10px;
    	font-size: 19px;
    	color: #FFF;
    	}
    
    #nav li, #subnav li {
    	float:left;
    	list-style:none
    	}
    
    #nav a, #nav a:visited {
    	color:#FFF;
    	text-decoration:none;
    	}
    
    #nav a:hover, #nav a:active,
    li.current_page_parent a,
    li.current_page_parent a:visited,
    #nav li.current_page_item a,
    #nav li.current_page_item a:visited
            {
    	color: #608b82;
    	font-weight: bold;
    	text-transform: uppercase;
    	}
    #subnav {
    	display: block;
    	float: right;
    	width: 926px;
    	background-color: #BEBCAD;
    	height: auto;
    	margin-right: -5px;
    	margin-bottom: 0px;
    	border-right-width: 10px;
    	border-left-width: 10px;
    	border-right-style: solid;
    	border-left-style: solid;
    	border-right-color: #FFF;
    	border-left-color: #FFF;
    	margin-left: 10px;
    	padding-top: 8px;
    	padding-bottom: 8px;
    	}
    
    #subnav li {
    	color: #2b443f;
    	line-height: 1px;
    	margin-top: 8px;
    	margin-right: 10px;
    	margin-bottom: 10px;
    	margin-left: 10px;
    	padding-top: 0px;
    	padding-right: 0px;
    	padding-left: 0px;
    	}
    
    #subnav a, #subnav a:visited {
    	color:#2b443f;
    	text-decoration:none;
    	}
    
    #subnav a:hover, #subnav a:active,
    #subnav li.current_page_item a,
    #subnav li.current_page_item a:visited {
    	text-transform: uppercase;
    	font-weight: bold;
    	}

Viewing 7 replies - 1 through 7 (of 7 total)
Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Centering Navigation’ is closed to new replies.
Skip to toolbar