#convention


CSS Naming Convention for Classes and IDs?

Well, just re-read­ing some of the cur­rent book­marks in my bag. To note:

I am try­ing to clean up and make things more effi­cient here at work. One goal would be to have a base CSS that will serve as a start­ing point for our Pro­duc­ers and Fron­tend peeps. Anoth­er goal would prob­a­bly be a con­ven­tion on how to use it and/or cre­ate new class­es and IDs.

One of the things that keeps com­ing up late­ly would be the nam­ing con­ven­tion of class­es and IDs. I used to imple­ment this kind of for­mat “class_name”. Then, only to switch to “class-name” in ear­ly ’06. Fast-for­ward to a cou­ple of months into the year dur­ing a project, I came to find out that if you are refer­ring to either a class­name or an ID (i.e. getEle­ment­ById, or some­thing like that) that the value’s hyphen get stripped out. Can some­one con­firm this phe­nom­e­na and/or myth? That is, for exam­ple, doing “id-name” would be imple­ment­ed like so:

document.getElementById("idname")

With that how­ev­er, would it be more read­able using a camel­Cased name? Although against Tantek’s step #4 in terms of sav­ing the user(s) poten­tial headaches. But would there be prob­lems if there was a stan­dard with­in one’s orga­ni­za­tion? That is, class­es and IDs writ­ten as a vari­able, i.e. some­thing­LikeThis; no hyphens and no under­score.

I look for­ward to hear­ing your end­less wis­dom on this sub­ject sirs and madams. Thanks in advance.