<diazo:rules
    xmlns:diazo="http://namespaces.plone.org/diazo"
    xmlns:css="http://namespaces.plone.org/diazo/css"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    >

    <diazo:before theme="/html/body/div/h1">
        <div id="from-rules">From the rules</div>
        <!-- A comment from the rules -->
        <p xmlns="http://www.w3.org/1999/xhtml">
            Check that a stray xmlns does not end up in the output
        </p>
    </diazo:before>

    <diazo:append css:theme="head">
        <style type="text/css">
            /* From the rules */
            body > h1 { color: red; }
        </style>
    </diazo:append>

    <diazo:replace css:theme="#details">
        <dl id="details">
            <xsl:for-each css:select="table#details > tr">
                <dt><xsl:copy-of select="td[1]/text()"/></dt>
                <dd><xsl:copy-of select="td[2]/node()"/></dd>
            </xsl:for-each>
        </dl>
    </diazo:replace>
    <!--
        Note that css expressions are converted to `placeless` xpath expressions,
        so css:select="table#details > tr" converts to select="//table[@id='details]/tr".

        This means it would not be possible to use css:select="td:first-child > *" as
        you want a relative selector here.
    -->
</diazo:rules>
