Hi,
I have just spent 2 hours trying to figure out why the psuedo class 'a:active' would not work on menu list items in my footer. After much head scratching and a bit of research I discovered that Drupal assigns an '.active' class to the 'a' element which overrides a:active. Makes sense now that I think about it it is an easy gotcha to fall into particularly when using the guide at line 210 in html-reset.css for the order of link settings:
/*
* Links
*
* The order of link states are based on Eric Meyer's article:
* http://meyerweb.com/eric/thoughts/2007/06/11/who-ordered-the-link-states
*/
a:link {
}
a:visited {
}
a:hover,
a:focus {
}
a:active {
}
/*
* Tables
*
* Drupal provides table styling which is only useful for its admin section
* forms, so we override this default CSS. (We set it back in forms.css.)
*/The guide is helpful however it might save other users a lot of time if a comment could be placed next to the 'a:active' at line 226 stating for example 'Drupal overrides the a:active pseudo class used in menu items by assiging the class '.active' to the 'a' element. If you want a link menu item to display differently when viewing the page to which it refers use 'li a.active' to target it'.
Thanks
Comments
Comment #1
johnalbinhttp://nicolasgallagher.com/about-normalize-css/