Why are dashes preferred for CSS selectors / HTML attributes?

Question

In the past I\'ve always used underscores for defining class and id attributes in HTML. Over the last few years I changed over to dashes, mostly to align m

Answer 1

I don't think anyone can answer this definitively, but here are my educated guesses:

1. Underscores require hitting the Shift key, and are therefore harder to type.

2. CSS selectors which are part of the official CSS specifications use dashes (such as pseudo-classes like :first-child and pseudo-elements :first-line), not underscores. Same thing for properties, e.g. text-decoration, background-color, etc. Programmers are creatures of habit. It makes sense that they would follow the standard's style if there's no good reason not to.

3. This one is further out on the ledge, but... Whether it's myth or fact, there is a longstanding idea that Google treats words separated by underscores as a single word, and words separated by dashes as separate words. (Matt Cutts on Underscores vs. Dashes.) For this reason, I know that my preference now for creating page URLs is to use-words-with-dashes, and for me at least, this has bled into my naming conventions for other things, like CSS selectors.