Trying to center navigation bar (Reddle theme)

  • wanderingrelentless1 · Member ·

    I’ve been trying unsuccessfully for hours to center my navigation links within my navigation bar. I’ve posted the code from the main stylesheet below as it pertains to my navbar (#access). I am using a child theme to make modifications.

    /* =Menu
----------------------------------------------- */

#access {
	background: #000;
	clear: both;
	display: block;
	float: left;
	margin: 0 auto 3.23em;
	width: 100%;
}
#access ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
}
#access li {
	float: left;
	position: relative;
}
#access a {
	color: #eee;
	border-bottom: .375em solid #444;
	display: block;
	line-height: 3.23em;
	margin: 0 1px 0 0;
	padding: 0 28px;
	text-decoration: none;
}
#access ul ul {
	background: #b12930;
	border-top: 1px solid #a41c23;
	-webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
	-moz-box-shadow:    0 3px 3px rgba(0, 0, 0, 0.2);
	box-shadow:         0 3px 3px rgba(0, 0, 0, 0.2);
	display: none;
	float: left;
	position: absolute;
		top: 3.5em;
		left: 0;
	z-index: 99999;
}
#access ul ul ul {
	left: 100%;
	top: 0;
}
#access ul ul a {
	border: none;
	color: #ffe8ef;
	margin: 0;
	padding: 0 28px;
	width: 200px;
	height: auto;
}
#access ul ul li {
	border-bottom: 1px solid #a41c23;
}
#access li:hover > a {
	border-color: #b12930;
	color: #fff;
}
#access ul ul :hover > a {
	background: #ac242b;
	color: #fff;
}
#access ul ul a:hover {
}
#access ul li:hover > ul {
	display: block;
}
#access li.current_page_item a,
#access li.current-menu-item a {
	border-color: #b12930;
}

    my blog is posted at kathleenberbec.com

    thank you for your help!!

    The blog I need help with is: (visible only to logged in users)

  • hfzrhmn · Member ·

    Hi there, as you are using a self-installed WordPress version, the correct place to ask around is the WordPress.org forum. Try here:

    http://wordpress.org/support/forum/themes-and-templates

  • kathrynwp · Staff ·

    Hi Kathleen, your menu looks centered to me – kudos on figuring this out.

    This is the CSS I see that you used to centre the menu:

    /*centre navbar links*/

#access {
	overflow: hidden;
	position: relative;
}
#access ul {
	clear: left;
	float: left;
	position: relative;
	left: 50%;
}
#access li {
	right: 50%;
}

    You can actually remove this line, which I omitted above:

    text-align: centre;

    It’s not being applied because “centre” should be spelled “center” and it’s not needed.

    As hfzrhmn mentioned, these forums are for WordPress.com sites, and your site is self-hosted on your own host. (The CSS above should work on WordPress.com sites, though.) If you need further help with the self-hosted version of Reddle, feel free to post in the Reddle forum over in the WordPress.org forums:

    http://wordpress.org/support/theme/reddle

  • The topic ‘Trying to center navigation bar (Reddle theme)’ is closed to new replies.