WordPress.org

1. Michael Shedd
   Member
   Posted 2 years ago #

   i'm trying to figure out how to change the navigation hover color to red on my site. i've been going through the css trying to figure out what hover section to change, but i'm not quite sure why there are a couple of "hover" sections. if you could give me a hand that would be great thanks

   /* navigation */
   #nav					{ zoom: 1; max-height: 35px; }
   #nav-content			{ margin: 0 auto; width: 958px; background: url(../../images/topnav.jpg) repeat-x #CCC; height: 30px; border: 1px solid #CCC; }
   
   .sf-menu				{ font-weight: bold; }
   .sf-menu, .sf-menu ul	{ float: left; list-style: none; line-height: 30px; padding: 0; margin: 0; }
   .sf-menu a				{ display: block; text-decoration: none; padding: 0 15px; text-transform: uppercase; color: #666; font-size: 11px; }
   .sf-menu li				{ float: left; padding: 0; }
   .sf-menu ul				{ position: absolute; left: -999em; height: auto; width: 150px; margin: 0; line-height: 1; border: none; }
   .sf-menu li li			{ width: 148px; border: solid #CCC; border-width: 1px 1px 0; }
   .sf-menu li li a		{ background: url(../../images/techblue/content-bg.jpg) repeat-x top #FFF; padding: 7px 10px; width: 128px; font-size: 12px; text-transform: none; }
   .sf-menu li ul ul		{ margin: -27px 0 0 148px; }
   .sf-menu li li:hover	{ }
   .sf-menu li:hover ul ul, .sf-menu li:hover ul ul ul, .sf-menu li:hover ul ul ul ul, .sf-menu li.sfhover ul ul, .sf-menu li.sfhover ul ul ul, .sf-menu li.sfhover ul ul ul ul { left: -999em; }
   .sf-menu li:hover ul, .sf-menu li li:hover ul, .sf-menu li li li:hover ul, .sf-menu li li li li:hover ul, .sf-menu li.sfhover ul, .sf-menu li li.sfhover ul, .sf-menu li li li.sfhover ul, .sf-menu li li li li.sfhover ul { left: auto; z-index: 2; }
   .sf-menu li ul li:hover a, .sf-menu li ul li li:hover a, .sf-menu li ul li li li:hover a, .sf-menu li ul li li li:hover a { background: url(../../images/techblue/feed-title.jpg) repeat-x top #004688; color: #FFF; }
   .sf-menu li:hover li a, .sf-menu li li:hover li a, .sf-menu li li li:hover li a, .sf-menu li li li li:hover li a { background: url(../../images/techblue/content-bg.jpg) repeat-x top #FFF; color: #666; }

2. Peter Boosten
   Member
   Posted 2 years ago #

   my bet would be
   .sfmenu a:hover

   (doesn't exist, but you can create one)

   Peter

3. Michael Shedd
   Member
   Posted 2 years ago #

   thanks for the reply. so i tired inserting

   .sfmenu a:hover { color: #FF0000 }
   at the end of the above section of code and nothing changed. is what i have wrong or should it be in a different place?

4. Peter Boosten
   Member
   Posted 2 years ago #

   sorry, that should have been

   .sf-menu a:hover { color: #ff0000; }

   (mind the dash).

5. Michael Shedd
   Member
   Posted 2 years ago #

   thanks man! that worked : ).

Topic Closed

This topic has been closed to new replies.