Support » Themes and Templates » Css element problem

  • Hi Guys,

    http://integra-av.co.uk/

    I’ve got over 6 months of working as a junior web developer under my belt.
    so working with wordpress is fairly common for me.

    My problem is I can’t seem to target the eco friendly tab with a css hover effect. I want the background to go green so I added this style to the style-sheet but it doesn’t seem to work.

    the image is a green tab.

    #menu-item-792: hover
    {
    
            background: url("http://www.integra-av.co.uk/wp-content/uploads/2012/11/main_menu3.png") no-repeat 0 0;
           }
Viewing 6 replies - 1 through 6 (of 6 total)
  • esmi

    (@esmi)

    Forum Moderator

    Try using Firefox with the Firebug add-on for this kind of CSS work.
    http://getfirebug.com/

    Moderator Andrew Nevins

    (@anevins)

    The hover pseudo element could/should be used with hyperlinks, also remove the space before the pseudo element.

    WPyogi

    (@wpyogi)

    Forum Moderator

    Try this:

    #menu-item-792 a:hover

    esmi

    (@esmi)

    Forum Moderator

    Um – not strictly correct. IE is pretty good with :hover these days and there are js fixes for earlier versions of IE. Pretty sure that Opera and Chrome (like Firefox) have always honoured :hover.

    Michael

    (@alchymyth)

    Forum Moderator

    probably a specificity problem;
    try to use !important on your style or try to find a more specific style;
    compare this with how the other menu list elements’ hover states are styled.

    not a WordPress problem 😉

    thanks guys it turns out the website has 2 style sheets effecting the styles.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Css element problem’ is closed to new replies.