CSS Naming Convention for Classes and IDs?


Well, just re-reading some of the current bookmarks in my bag. To note:

I am trying to clean up and make things more efficient here at work. One goal would be to have a base CSS that will serve as a starting point for our Producers and Frontend peeps. Another goal would probably be a convention on how to use it and/or create new classes and IDs.

One of the things that keeps coming up lately would be the naming convention of classes and IDs. I used to implement this kind of format “class_name”. Then, only to switch to “class-name” in early ’06. Fast-forward to a couple of months into the year during a project, I came to find out that if you are referring to either a classname or an ID (i.e. getElementById, or something like that) that the value’s hyphen get stripped out. Can someone confirm this phenomena and/or myth? That is, for example, doing “id-name” would be implemented like so:

document.getElementById("idname")

With that however, would it be more readable using a camelCased name? Although against Tantek’s step #4 in terms of saving the user(s) potential headaches. But would there be problems if there was a standard within one’s organization? That is, classes and IDs written as a variable, i.e. somethingLikeThis; no hyphens and no underscore.

I look forward to hearing your endless wisdom on this subject sirs and madams. Thanks in advance.