operations on document tree in CSS?

Question

I'm pretty sure this doesn't exist, but I wonder if anyone has done this kind of thing as an add-on for CSS.

Let's say we have an XML document containing the Code of Federal Regulations (CFR), and also say that the document itself cannot be edited (all we can do is use a style sheet to display it), and let's say that there is a subpart which contains multiple rules, and the XML document is roughly as follows:

<subpart>
<ruleNo>63.400</ruleNo>
<ruleTitle>Definitions</ruleTitle>
<ruleNo>63.410</ruleNo>
<ruleTitle>Applicability</ruleTitle>
...
</subpart>

Now I would like to write a stylesheet that puts the subpart content into a table, with rule numbers on the left column and rule titles on the right column. The task would be much easier if there were a way to select an adjacent ruleNo and ruleTitle as if they corresponded to a single node, and then write a rule for that imaginary node.

For example, there could be a node-defining functor => which would temporarily define as a node the part in braces. For example, Rule => subpart > {ruleNo + ruleTitle} would create a temporary node which would be the parent of any pair of siblings ruleNo + ruleTitle which were children of subpart.

Answer 1

CSS does not support manipulating the document tree, nor does it offer an ability to group element nodes in the manner that you describe. Additionally, the CSS2.1 table model does not offer a way to apply styles such that every ruleNo + ruleTitle pair can be formatted as an individual row: while CSS has a concept of anonymous boxes that can be created as ancestors or descendants, which also extends to the table model, it does not support generating a single anonymous box that acts as the parent row of a pair of ruleNo + ruleTitle cells at a time.

Preprocessor languages such as Sass and LESS are irrelevant as they're compiled into CSS anyway, so if it's not doable with CSS then neither is it doable with a preprocessor.

Given your current XML, it's not possible to use CSS to format it into a table with each row containing a ruleNo and a ruleTitle element. You'll want to use XSLT to transform it into an XHTML table with the corresponding rows instead.