PDA

View Full Version : Active sidebar item issues



j.blaise.n
23 Jun 2009, 06:56 PM
I'm having issues with the sidebar on my page

http://www.brsr.org/

Two of the menu items, Home and Common Questions, don't stay in their active state after being clicked on and I'm not sure why. Here's what the CSS for the sidebar looks like:


/* sidebar nav */
#sidebar { width: 183px; float: left; margin-bottom: 25px; margin-top: 10px; }
#sidebar ul { list-style-type: none; }
#sidebar li a { padding: 8px 0 8px 8px; width: 95%; display: block; background: url(img/sidebar-li-a.gif) repeat-x 0px 0px; color: #FFF; font-weight: bold; text-decoration: none; }
#sidebar li a:hover { background: url(img/sidebar-li-a.gif) repeat-x 0px -30px; }
#sidebar li a:active, #sidebar li .onpage { background: url(img/sidebar-li-a.gif) repeat-x 0px -30px; }
#sidebar li a.commerial { background: url(img/commerical-button.gif); color: #ff8400; font-weight: normal; padding-left: 27px; margin-top: 2px; width: 155px; }
#sidebar li a.commerial:hover { color: #000; }


Any help would be appreciated. Thanks!

Wickham
24 Jun 2009, 01:16 AM
Browsers treat the active state differently. Read this:-
http://www.wickham43.net/generaladvice.php#links

Most only show the active state while pressing the mouse button, not afterwards, (ie only while it is active) but IE retains the active state after you use the back button to return to the page you clicked on a link.

What you want may be focus, which again is treated differently because IE doesn't support focus, using active instead.