How should I handle this CSS Inheritance conundrum?
I have a class of images called glyphs that appear through out my site. Once upon a time they were all called just called
So basically, now that I have more than one box, each glyph gets a class glyph:1, glyph:2, etc. This number can go as large as the number of user submitted items on my site. How does CSS handle this? These items basically need two class names as far as I can see. But I'm pretty sure that's not allowed.
What I need: Set all images classes that begin with "glyph:" to 1em
This doesn't exist, right? glyph:*
Also, : is probably bad to use in a css class name, huh?
Don't use the : symbol. you can have more than one class for an element so do it like so
<div class="glyph glyph-1">Foo</div> <div class="glyph glyph-2">Foo</div> <div class="glyph glyph-3">Foo</div> <div class="glyph glyph-4">Foo</div>