cssplonediazo

Diazo rules split content in columns


I have to split my page content in columns with diazo rules, how can I do this?

from something like this

<div id="content">
    <div id="item1">content1</div>
    <div id="item2">content2</div>
    <div id="item3">content3</div>
    <div id="item4">content4</div>
    <div id="item5">content5</div>
    <div id="item6">content6</div>
    <div id="item7">content7</div>
    <div id="item8">content8</div>
    <div id="item9">content9</div>
</div>

to something like this

<div id="content">
    <div class="row">
        <div class="span3" id="item1">content1</div>
        <div class="span3" id="item2">content2</div>
        <div class="span3" id="item3">content3</div>
    </div>
    <div class="row">   
        <div class="span3" id="item4">content4</div>
        <div class="span3" id="item5">content5</div>
        <div class="span3" id="item6">content6</div>
    </div>
    <div class="row">           
        <div class="span3" id="item7">content7</div>
        <div class="span3" id="item8">content8</div>
        <div class="span3" id="item8">content8</div>        
    </div>
</div>

Solution

  • use something like the following:

    <xsl:template match="div[@id='content']/div[position() mod 3 = 1]">
      <div class="row">
            <xsl:for-each select=". | following-sibling::div[position() &lt; 3]">
                  <xsl:copy-of select="." />
            </xsl:for-each>
      </div>
    </xsl:template>
    <xsl:template match="div[@id='content']/div[position() mod 3 != 1]">
    </xsl:template>