title: Show output in multiple div's using XSLT
body: <p>I am trying to print output like this this generated by just replacing </p>
  
  <pre><code>xsl:value-of select ="@new_bname"/&gt; with A and other 
  
  xsl:value-of select ="@new_bname"/&gt; with B.
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/K0Y9z.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/K0Y9z.png" alt="Output i want"></a></p>
  
  <p>but i am getting output like this</p>
  
  <p><a href="https://i.stack.imgur.com/2JICZ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2JICZ.png" alt="Output i am getting which i don&#39;t want"></a></p>
  
  <p>My html code including xslt</p>
  
  <pre><code>&lt;xsl:for-each select="//bankinfo/items"&gt;
  
  
                  &lt;div class="col-sm-12 pad0"&gt;
                    &lt;xsl:if test="position() mod 2 != 0"&gt;
                  &lt;div class="col-sm-6 pad0l sm-pad0r"&gt;
                    &lt;button class="btn-block border-grey text-c pad5 radius-20 bg-grey outline-none "&gt;
                      &lt;a href="/ifsc-code-v1.aspx?page_mode=2&amp;amp;bank_url={@url_bank}" &gt;
                        &lt;xsl:value-of select ="@new_bname"/&gt;
  
                      &lt;/a&gt;
                    &lt;/button&gt;
                  &lt;/div&gt;
                     &lt;/xsl:if&gt;
  
                  &lt;xsl:if test="position() mod 2 = 0"&gt;
                  &lt;div class="col-sm-6 pad0r sm-pad0l sm-marg5t"&gt;
                    &lt;button class="btn-block border-grey text-c pad5 radius-20 bg-grey outline-none "&gt;
                      &lt;a href="/ifsc-code-v1.aspx?page_mode=2&amp;amp;bank_url={@url_bank}" &gt;
                      &lt;xsl:value-of select ="@new_bname"/&gt; 
                      &lt;/a&gt;
                    &lt;/button&gt;
                  &lt;/div&gt;
                &lt;/xsl:if&gt;
                &lt;/div&gt;
                &lt;div class="clearfix"&gt;&lt;/div&gt;
                &lt;div class="pad5t"&gt;&lt;/div&gt;
  
                &lt;/xsl:for-each&gt;
  </code></pre>
  
  <p>I want bank name 1 at A and bank name 2 at B place.
  Same continued till the last item in my <code>XML</code>.</p>
  
  <p><strong>EDIT:</strong>
  <code>@new_bname</code> is coming from <strong>DB</strong> via the controller and then rendered via <code>XSLT</code> to <code>HTML</code>.
  I am iterating with <code>&lt;xsl:for-each&gt;</code> for all the items in the <code>XML</code> and putting it on <code>HTML</code>.
  But i want First and second bank name side by side like picture number 1.
  I want the first <code>@new_bname</code> in the first div and next <code>@new_bname</code> in next div. but like this, i am generating same bankNames in 2 different columns </p>
  
  <p><strong>Edit 2</strong>
  Expected output 1 by hardcoding the bankname values</p>
  
  <p><strong><a href="https://i.stack.imgur.com/K8ItY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/K8ItY.png" alt="expected out put"></a></strong></p>
  
  <p>XML structure</p>
  
  <pre><code>&lt;items url_bank="a-c-b-ld" new_bname="ICICI"/&gt;
  
  &lt;items url_bank="a-d-c-bank" new_bname="HDFC"/&gt;
  
  &lt;items url_bank="a-m-c-b" new_bname="Bank OF AMERICA"/&gt;
  </code></pre>