>
>
> So you are saying that in a 'class="c2 c1"' case, it scans the CSS defs,
> sees .c1 and applies it, keeps going and sees .c2 which overrides the c1
> width?
>
That's how I would explain it, but I'm not certain how the browsers
actually compile it.  I would **guess** that it is compiled and only the
correct styles are applied, so there isn't actual overriding, or
re-painting; but that's just a guess.


> IOW: The order that you list the class in the HTML is ignored and only the
> order that the classes are defined in the CSS defs counts.
>
Yes, as long as specificity isn't a factor (and keep in mind the order in
which you include your stylesheets).  The StackOverflow link that was
included in this thread showed cases where the order in the attribute would
make a difference (using advanced selectors), but at a quick glance that
seemed like an *extreme* edge case that I couldn't imagine ever using in
practice.

All that being said, for this situation, I think I would probably try to
find a way to avoid doing what this discussion is centered around.  I've
been really trying to study up on oocss (
https://github.com/stubbornella/oocss/wiki) and smaccs (http://smacss.com/)
and I plan on implementing these concepts in the refactor I'm getting ready
to start.

So, off the top of my head, something like this:

/* layout stuff */
.boxNarrow {
  width: 5em;
}
.boxWide {
  width: 10em;
}
/* prettify */
.boxSkin {
  border-radius: 10px;
  box-shadow: 1px 1px 5px #000000;
}

<div class="boxSkin boxNarrow">...</div>
<div class="boxSkin boxWide">...</div>






-- 
Chris Rockwell
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to