Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • #17795

    Hi there,

    This must’ve been asked a million times already, but I can’t find a satisfactory answer. I’m trying to change the color of the navigation bar, but the only thing I’ve succeeded at is changing the entire header. Is this possible? You’ll find a picture below that hopefully explains what I want to change.

    [img]http://tinypic.com/1r510jo4[/img]

    Hopefully you’ll be able to help me out!

    #96910

    Hi harberentsen,

    I can’t see the image that you have posted. If its changing the top navigation menu color this code should work, just place it inside Quick CSS or custom.css:

    .header_color .main_menu ul:first-child > li > a, #top .header_color .main_menu .menu ul .current_page_item > a, #top .header_color .main_menu .menu ul .current-menu-item > a {
    color: #333;
    }

    Just change the color value. Hope this helps. :)

    Regards,

    Ismael

    #96911

    Oh, my bad. this is a direct link to the image: http://i47.tinypic.com/10p14t3.jpg

    I’ve tried that particular piece of code and it changed the font color, but only when I delete the other pieces of code I inserted into Quick CSS. It’s a neat trick and I might use it, so thank you for that. However, I would like fill the navigation ‘bar’. So I’d like to keep the header background white, but I’d want to give the background behind the navigation menu another color.

    Edit:

    I just came up with another question. Is it possible to change the font of the navigation menu as well? I’d like to change it into the same font used for the h1 etc tags.

    Thanks for the help!

    #96912

    Hi harberentsen,

    Try to use this code:

    .main_menu {
    background: #ccc;
    margin: 0;
    padding: 9px 0;
    }

    Just change the background color value. :)

    Regards,

    Ismael

    #96913

    Thank you! We’re getting closer;) I don’t want to take up too much of your time, but as you can see from the picture there’s still a blank space left and right of the menu. Is it possible to fill those parts as well?

    Here’s a picture: http://i48.tinypic.com/ndsg7.jpg

    Also, I had just edited my post, if it’s not too much trouble, could you answer the question about the font type as well?

    Your help is really appreciated!

    #96914

    Hi harberentsen,

    Kindly replace the code I have given you with this code:

    .main_menu {
    background: #ccc;
    bottom: 0;
    left: -50%;
    margin: 0;
    padding: 9px 0;
    position: absolute;
    width: 200%;
    }

    .menu-main-menu-container {
    display: block;
    height: 100%;
    margin: 0 auto;
    width: 930px;
    }

    Hope this helps. :)

    Regards,

    Ismael

    #96915

    Did the trick! Thanks a bunch, Ismael!

    Last question, is it possible to alter the font type of the navigation menu into, for example, a Google web font?

    #96916

    Hey!

    Yes, you can use following css code and change the font family value if you like:

    .main_menu ul.menu li {
    font-family: Arial;
    }

    Regards,

    Peter

    #96917

    Thank you for the suggestion! I didn’t get it to work with that piece of code, but I added that font family to layout.css and now it works perfectly!

    Thanks for all your help!

Viewing 9 posts - 1 through 9 (of 9 total)

The topic ‘Color of navigation menu’ is closed to new replies.