CSS: grouping sub-element styles for a specific class/id/tag in CSS3?

Hi W3C-list,

I am wondering if CSS3 will have a mechanism to group child rules for one
class/id/tag? I had the idea this morning when I had to write rules similar
to this:

[CSS]
#header #navigation {. }
#header #navigation ul {. }
#header #navigation ul li {. }
[/CSS]

So I thought that a syntax similar to the following could be pretty handy
because you'd find all rules for sub-elements inside the parent's css rule:

[CSS]
#header #navigation {
  ul {
    li {
      /* li's css rules */
      ...
    }
    /* ul's css rules */
    ...
  }
  /* #header #navigation's css rules */
  ...
}
[/CSS]

Less writing, more structure, the sequence of appearance could also be
predefined (i.e. if a class defines sub-element rules, these have to be
defined first, after this the class' own style rules have to be defined)
which could help reading longer CSS stylesheets much more easy.

What do you think?

Regards,

Sascha

P.S. This is my first post to the list, so please excuse any mistakes.

Received on Wednesday, 29 September 2010 15:50:02 UTC