WordPress.org

1. danny_getextra
   Member
   Posted 6 months ago #
   

   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;
          }

2. esmi
   Theme Diva & Forum Moderator
   Posted 6 months ago #
   

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

3. Andrew Nevins
   Volunteer Moderator
   Posted 6 months ago #
   

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

4. WPyogi
   Volunteer Moderator
   Posted 6 months ago #
   

   Try this:
   

   #menu-item-792 a:hover

5. esmi
   Theme Diva & Forum Moderator
   Posted 6 months ago #
   

   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.

6. alchymyth
   The Sweeper & Moderator
   Posted 6 months ago #
   

   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 ;-)

7. danny_getextra
   Member
   Posted 6 months ago #
   

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

Reply

You must log in to post.