kj wrote:
I would like to break down my stylesheets into a modules library,
but I can't figure out how to solve the problem of avoiding namespace
collisions for CSS classnames. What's considered "best practice"
in this area?
We use a single generalised style sheet to control the display of any
content appearing in our pure content-driven sites. Essentially this
means we have the idea of a virtualised page layout that means we can
customise any content to any style we wish just from CSS (we have
one-click template switching examples on the site). This means our CSS
style sheets are richer and bigger than normal, but the benefit is
complete flexibility. It also means we have standardised names for
items and areas on the page.
Our approach is to consider the page as a series of layers, rather than
as a series of linear text elements (this follows the box model pretty
readily)
For instance the main .pagelayout 'box' has boxs that divide the page
into key areas (header, leftcol, main, rightcol, bottom etc) as layers
'on top' of it. From here we then create sub-classes (eg headright,
headmain, headtop). If necessary we can also subselect elements below
this. To swap from one header style to another is just a case of
overwriting these styles which allows a library of styles to be built
up and used.
If we place what we call 'components' into the HTML (eg a gallery
object, a music player object etc), then these take their own styling
following a similar pattern and naming convention again thinking of
each as a layer on top of the containing box. Once again this means
that components can be styled with a range of different CSS, and by
separating things this way means we can mix and match stylesheets.
Saul
www.notanant.com
communities of websites
