Trying to target a navbar icon with CSS

[mikerayjones]

Hi, I’m having trouble targeting the Facebook icon in the navbar at http://pf.ray-jones.org.uk/ with css. I’ve tried

.x-navbar .x-nav > li.x-navbar-facebook > a,
.x-navbar .x-nav > li.x-navbar-facebook > a:hover {   /* STYLES GO HERE */ }

but it’s not working.

Can you help please?
Many thanks.

[paul.r]

Hi,

Your code is correct, but I am not sure what styles have you added.

You can try this code, so can easily check if it is working.

.x-navbar .x-nav > li.x-navbar-facebook > a { 
    background:blue;
    color:#fff;
}

.x-navbar .x-nav > li.x-navbar-facebook > a:hover { 
    background:yellow;
    color:red;
}

Please add it in Theme Options > CSS

Thanks

[mikerayjones]

Thanks for confirming I was on the right track. I found the problem - a syntax error on the preceeding line.

Thanks again!

[jade]

Hi Mike,

To verify for CSS error, please copy all the codes that are in the Global CSS and paste it here.

It should provide some information if there are any CSS error that is causing the issue that you have to fix so that the CSS codes will work.

Hope this helps.