Need help? Check out our Support site, then


Can't center nav bar

  1. thesmartcookiecook
    Member

    It may be hard to tell, but the text in my nav bar above the header is off-centered. The only reason it almost looks centered is because I have it filled with links, but I would like to center it so I could remove some of those. I've tried to obvious things in my CSS, but for whatever reason, I can't figure it out. Suggestions?

    my site

    The blog I need help with is thesmartcookiecook.com.

  2. This will do it, but there are disclaimers: It blows up if the menu system goes to a second line (goes back to float left).

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

    Also do this to split the padding on left and right of the menu items so it looks more centered.

    #nav li a {
    padding-left: 7px;
    padding-right: 7px;
    }
  3. thesmartcookiecook
    Member

    That's okay because I don't want two lines. So if I get rid of a link or two in the nav this will still be centered?

  4. Try this:

    #nav ul {
    display: inline-block; margin: 2px auto;
    }

    Make sure to test it in a few different browsers.

    Try to remove some of the other unnecessary CSS you added before like "float: center" to take a way some clutter.

  5. Yup.

  6. I should've refreshed. :)

  7. Yours is much less complex than mine.

    Use @designsimply's solution.

  8. thesmartcookiecook
    Member

    Okay, thank you both!

  9. thesmartcookiecook
    Member

    Okay, now my drop-down menus in the nav bar are cut off.

  10. I'm not seeing anything cut off. All the dropdowns appear complete to me.

  11. Oh, I see. Remove the "overflow: hidden;" from #wrapper.

  12. thesmartcookiecook
    Member

    Try scrolling down to one of the menus that branches off. If you go to "recipes and more" then recipes, the next menu that comes up is cut off on the right.

  13. thesmartcookiecook
    Member

    Ah thank you!

  14. You are welcome.

Topic Closed

This topic has been closed to new replies.

About this Topic