[resolved] Centering the nav bar (4 posts)

  1. jessispeer
    Posted 2 years ago #

    I've searched through the forum and tried a couple suggestions on this issue, but haven't been able to find a solution that works for me.

    I need to center the nav bar on a website I'm working on: http://dantreranch.com

    To make it a little easier, this is what the style.css code is for my navigation bar right now.

    /* =Navigation
    -------------------------------------------------------------- */
    .navigation {
    	margin: 0 0 1.7em 0;
    	overflow: hidden;
    .navigation a:visited {
    	color: #0060ff;
    .navigation a:visited:hover,
    .navigation a:active,
    .navigation a:hover {
    	color: #df0000;
    .nav-previous {
    	float: left;
    	width: 50%;
    .nav-next {
    	float: right;
    	text-align: right;
    	width: 50%;
    #nav-above {
    .single #nav-below {
    	display: none;
    .paged #nav-above,
    .single #nav-above {
    	display: block;

    Please help! Thanks in advance.

  2. Hi there, this should work for a single-line menu with no submenu items:

    #access .menu {
         float: left;
         left: 50%;
         position: relative;
    #access .menu li {
         position: relative;
         right: 50%;

    Just a heads-up that the best way to make changes to a theme is to use a child theme, so your tweaks won't be overwritten when updating the theme. Here are some guides in case you haven't made one before:


    If you're only making CSS changes - and not editing other theme files - you could alternatively use a custom CSS plugin like the Custom CSS module in Jetpack.

  3. jessispeer
    Posted 2 years ago #

    Oh my gosh, it worked!! THANK YOU!!! You are a wonderful person! And thanks for the reminder about using a child theme, I've done it before, but not with this current theme, so I'll do that now! THANKS!!

  4. My pleasure, glad that worked for you!

Topic Closed

This topic has been closed to new replies.

About this Theme

About this Topic