Change NAV color

Community Forums Forums Showcase and Feedback Change NAV color

Tagged: ,

This topic contains 6 replies, has 3 voices, and was last updated by  agapeonline 1 year, 5 months ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #15597

    agapeonline
    Participant
    Post count: 34

    Please help me change the background color of my NAV bar to bar. I want white letters on black background. I’ve been trying to figure out Firbug to no avail  http://epinkusfineart.com/

    #15601

    anitac
    Participant
    Post count: 6991

    Look for this around line 147. Remove the GIF. You could just put background: #000000; in that line all together.

    #nav ul, #subnav ul, #header ul.nav, #header ul.menu {
    background: url(“images/menu_bg.gif”) repeat-x scroll 0 0 transparent;
    border-left: 0 solid #000000;
    border-right: 1px solid #E4E9ED;
    float: left;
    margin: 0;
    padding: 0;
    }


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #15602

    marybaum
    Participant
    Post count: 123

    I’ve never been sure what the big whoop about Firebug is. I greatly prefer the command Inspect Element in either Chrome or Firefox (key command cmd-opt-I or ctrl-alt-I in either browser), which will target the exact element you’re looking to change – just select that element with the Controle key if you’re old-school like me on the Mac and don’t like to right-click, or right-click if you’re a young whippersnapper who uses two buttons. (I turn the second button OFF. On the Magic Mouse, once right-click is enabled, I find I can’t left-click anymore! So, old-school, one-button-only is how I roll.)

    In your case, the nav elements are on line #192 of style.css, and I see that your hover style already has the black background and white type you want.

    It may be that you actually want to look at some other rules in that vicinity on your style sheet – I presume you know that when you find the precise element you want to target, you want background: #000; and color: #fff; – but just in case, that’s what you paste in.

    Hope that helps!

     


    Be it ever so run down, there’s no place like FriendFeed. ;-)

    #15605

    anitac
    Participant
    Post count: 6991

    I see you got it… now if you want to remove that white line on the Nav on the end look for this code – change the border-right to black (#000000)

    #nav ul, #subnav ul, #header ul.nav, #header ul.menu {
    border-left: 0 solid #000000;
    border-right: 1px solid #E4E9ED;
    float: left;
    margin: 0;
    padding: 0;
    }


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #15609

    agapeonline
    Participant
    Post count: 34

    Thank you guys SOOO much. I should have asked and save myself 2 hours :( – but I was so eager to understand Firebug. Thank you so much.

    #15618

    anitac
    Participant
    Post count: 6991

    You’re welcome. I love Firebug. If you would like a short tutorial on it one day/evening – email me on my website and we can set up a virtual meeting.


    Let me help you customize your theme, responsive header, Buddypress, Agentpress or technical issue!
    Visit me here: Cre8tiveDiva.com | Tweet Me! | Plus Me!
    When asking for help, please provide a link or screen shot showing your problem!

    #15678

    agapeonline
    Participant
    Post count: 34

    Thank you.  I surely will take you up on it.

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

You must be logged in to reply to this topic.