XSL two column unordered list

[zigzag]

I need help with xsl transformation. I have xml being spitted out by SharePoint Server control as below:\[code\]<rows> <row>A</row> <row>B</row> <row>C</row> <row>D</row> <row>E</row> <row>F</row> <row>G</row> <row>H</row></rows>\[/code\]I need to transform the above xml into below: \[code\] <== A-----------B ==> An li sliding back and forth with the help of a slider plugin C-----------D E-----------F G-----------H\[/code\]LIKE THIS:

Required HTML in the following format as that's how the slider plugin demands the html be rendered as for it to work:\[code\]<div class="content-carousel"><!-- start Basic Jquery Slider --> <ul class="bjqs"> <li> <div class="content-left"> <h4>A</h4> </div> <div class="content-right"> <h4>B</h4> </div> </li> <li> <div class="content-left"> <h4>C</h4> </div> <div class="content-right"> <h4>D</h4> </div> </li> . . </ul></div>\[/code\]WHAT I HAVE CURRENTLY: I am able to get two column layout but tables rows are involved to do so , which emits unnecessary markups not good for the slider plugin. So for each row, the following applies:\[code\] <xsl:if test="$CurPos = 1 "> <xsl:text disable-output-escaping="yes"><div><table></xsl:text> </xsl:if> <xsl:if test="$CurPos mod 2 = 1"> <xsl:text disable-output-escaping="yes"><tr></xsl:text> </xsl:if> <li> <td width="50%" valign="top"> <table width="90%"> <tr height="35px" min-height="35px" valign="top"> <td> <span> <xsl:if test="string-length($SafeImageUrl) != 0"> <div class="image-area-left"> <a href="http://stackoverflow.com/questions/14042573/{$SafeLinkUrl}" target="{$LinkTarget}"> <img class="image" src="http://stackoverflow.com/questions/14042573/{$SafeImageUrl}" alt="{@ImageUrlAltText}" /> </a> </div> </xsl:if> <H3> <a href="http://stackoverflow.com/questions/14042573/{$SafeLinkUrl}"> <xsl:value-of select="@Title"/> </a> </H3> <div class="newsgist"><xsl:value-of select="substring(@Comments,0,200)"/> <xsl:if test="string-length(@Comments) > 200">