Using - over _ in CSS to support "older" browsers

Question

I am refactoring some CSS and figured I would review based on this helpful best practices reference. One thing that is mentioned in using - instead of _ in naming types, and of COURSE I named all my types with _! The reference mentions doing this for "older browser" compatibility, but not what this means exactly. Is this IE6 level stuff, where I can (in my opinion) safely ignore anyone still using that junk? Or is this IE9 level stuff, where I know a ton of my readers are still in IE9? And, what are the implications with Android browsers? Knowing that Android basically stops getting updates the moment you buy the phone in some cases, am I gimping myself there as well if I don't bother to refactor?

Answer 1

Those naming used to override CSS attributes for specific browsers, and they are bugs/hacks in browsers that allow you to style browser with that found bug to behave as intended. check browserhacks for more information about this, also browser specific css hacks

example

body {
  background-color: red;
  _background-color: blue;
}

this CSS will be apply red background to the body and they will ignore _background-color: blue; because its invalid CSS attribute, but for IE6 it will recognize it as a valid CSS attribute (because IE6 CSS validator will sanitize it and remove the leading _) and will override the background-color: red;