[SOLVED] Different background on activer and hover menu tabs
 

How can I get the background to be different on the active and hover menu tabs? This is the site I am working on http://blueberrybuilders.com/test/.

look at the sticky in this forum

I used this code from a thread

div#menu1 .current-menu-item a {
background-color: #666666;
color: #ffffff !important;
}

I am sorry to say, it did not make any difference.

you did not use a Pseudo-classes - do a google search using 'css Pseudo-classes' and read about them

I read it, and cam up with this.

div#menu1 .current-menu-item a:hover {
background-color: #666666;
color: #ffffff !important;
}

Did not work :(

I did this, and it did the job.

/* ================================================ */
/* how to highlight current page */
/* ================================================ */
ul.rMenu li.current_page_item a:active,
ul.rMenu li.current_page_item a:visited,
ul.rMenu li.current_page_item {
color: #ffffff !important;
background: #748daf;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#748daf), to(#5b6e88))!important;
background: -webkit-linear-gradient(#99BBEA, #4991C9);
background: -moz-linear-gradient(#99BBEA, #4991C9);
background: -ms-linear-gradient(#99BBEA, #4991C9);
background: -o-linear-gradient(#99BBEA, #4991C9);
background: linear-gradient(#99BBEA, #4991C9);
-ms-filter:"progid:DXImageTransform.Microsoft.linear-gradient(startColorstr=#99BBEA,endColorstr=#4991C9 )";
filter:progid:DXImageTransform.Microsoft.linear-gradient(startColorstr=#99BBEA,endColorstr=#4991C9 );
}