Reducing Selector Verbosity

Hi All,

I'm wondering if there's been any active discussion on reducing the
verbosity of CSS selectors. Look at any stylesheet, and you'll likely see a
lot of repetition in selectors, e.g.

h1 > a, h2 > a, h3 > a, h4 > a, ... {
    color: black;
}


Another common pattern is this one:

#navigation { }
#navigation a { }
#navigation a:link { }
...

#navigation > ul > li > ul {}


There's a couple of simple and logical ways to handles these cases. For the
first case, a parenthesis-based grouping syntax would work well, while for
the second case, sub-selectors would do an equally good job. Examples...

(h1, h2, h3, h4, h5, h6) > a {
    blah: bleh;
}

#navigation {
    a {
        :link {

        }
    }
}


I guess such a change would be akin to introducing variables. It increases
the complexity of the stylesheet markup, but I personally think it's
overdue. Look at the complexity of CSS3 and the latest drafts compared to
CSS1. We're adding more and more functionality, which as we use it,
increases the verbosity of our stylesheets. I think CSS needs to facilitate
this blow-out in new functionality by providing new constructs to
reduce repetition and lighten up stylesheets. One could perhaps even make
an argument on bandwidth.

Thoughts before I continue any further?

Received on Tuesday, 11 June 2013 22:42:33 UTC