Combining several techniques, I've created the top level navigation for this page here:
http://demo.kelleninteractive.net/phii/www/test.html The images that are used for the navigation are structured as follows: http://demo.kelleninteractive.net/phii/www/images/nav_subjects.gif top: normal state middle: hover state bottom: active state Firefox2 behaves as expected, so you can view that page in Firefox 2.x to see the desired results. Here is a chunk of the relevant CSS (the code for 1 of the navigation items) #nav li#nav_programs{ background: url("../images/nav_programs.gif") no-repeat; width: 67px; } #nav li#nav_programs:hover, #nav li#nav_programs.sfhover{ background-position: 0 -43px; } #nav li#nav_programs.active{ background-position: 0 -86px; } IE6 will only process the first declaration. That is; the way it is set up now, the hover state will work correctly but the active state will not. If I declare the active state first in the css, the active state will work and the hover state will not. Any advice or help would be much appreciated; I've been beating my head against a wall on this one for about an hour. Brian ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
