content query webpart itemstyle wrapped by group style in XSLT

Question

I have the following markup:

<ul id="slider">    
    <!-- slider item -->
    <li>
        ...
    </li>
    <!-- end of slider item -->
</ul>

and I have defined the following xsl in header.xsl and itemStyle.xsl for displaying data from a SharePoint 2010 List:

<!-- in header.xsl -->
<xsl:template name="Slider" match="*[@GroupStyle='Slider']" mode="header">
    <ul id="slider">
    </ul>
</xsl:template>

<!-- in itemStyle.xsl -->
<xsl:template name="Slider" match="Row[@Style='Slider']" mode="itemstyle">
    <xsl:variable name="SafeImageUrl">
        <xsl:call-template name="OuterTemplate.GetSafeStaticUrl">
            <xsl:with-param name="UrlColumnName" select="@Picture"/>
        </xsl:call-template>
    </xsl:variable>
    <xsl:variable name="Title">
        <xsl:call-template name="OuterTemplate.GetTitle">
            <xsl:with-param name="Title" select="@Title" />
        </xsl:call-template>
    </xsl:variable>
    <xsl:variable name="Details">
        <xsl:call-template name="OuterTemplate.GetTitle">
            <xsl:with-param name="Title" select="@Details" />
        </xsl:call-template>
    </xsl:variable>
    <li>
        <img src="{$SafeImageUrl}" alt="{$Title}" />
        <section class="media-description">
            <h2 class="slider-headline"><xsl:value-of  disable-output-escaping="yes" select="$Title" /></h2>
            <p><xsl:value-of disable-output-escaping="yes" select="$Details" /></p>
        </section>
    </li>
</xsl:template>

but the thing is, I want the ul element to wrap those li's directly, as shown above in the markup, so how can I do that ? or is there a better way to achieve that ?

Answer 1

Put the ULs inside contentquerymain.xsl instead of header.xsl