How to use on the same content box 2 columns of vertical tabs? <p>How can I create a new column which is identical to the first column, and have it display one column to the right?</p> <p>I want the new column to have the same properties as the first column because I want to add more things to this tabs and only on 1 column they are ugly.</p> <p>Here is what I have tried: <a href="http://jsfiddle.net/26zQS/6/" rel="nofollow">http://jsfiddle.net/26zQS/6/</a></p> <pre><code>&lt;div class="verticalslider" id="textExample"&gt; &lt;ul class="verticalslider_tabs"&gt; &lt;li&gt;&lt;a href="#"&gt;Catedra de Limba si Literatura Romana&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Catedra de Matematica&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Catedra de Informatica&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Limba engleza&lt;/a&gt;&lt;/li&gt; &lt;li&gt;&lt;a href="#"&gt;Limba Germana&lt;/a&gt;&lt;/li&gt; &lt;/ul&gt; &lt;ul class="verticalslider_contents"&gt; &lt;li&gt; &lt;h2&gt;Catedra de Limba si Literatura Romana&lt;/h2&gt;&lt;/br&gt; &lt;p id="profesor"&gt; Popa Alina &lt;/br&gt; Nadia Pascu&lt;/br&gt; &lt;/p&gt; &lt;/li&gt; &lt;li&gt; &lt;h2&gt;Catedra de Matematica&lt;/h2&gt;&lt;/br&gt; &lt;p id="profesor"&gt; Ciubotariu Boer-Vlad &lt;/br&gt; Diaconu Ilie&lt;/br&gt; Gorcea Violin &lt;/br&gt; &lt;/p&gt; &lt;/li&gt; &lt;li&gt; &lt;h2&gt;informatica&lt;/h2&gt; &lt;p id="profesor"&gt; Wainblat Gabriela&lt;/br&gt; Nistor Ancuta&lt;/br&gt; &lt;/li&gt; &lt;li&gt; &lt;h2&gt;Limba Engleza&lt;/h2&gt; &lt;p id="profesor"&gt; Wainblat Gabriela&lt;/br&gt; Nistor Ancuta&lt;/br&gt; &lt;/li&gt; &lt;li&gt; &lt;h2&gt;Germana&lt;/h2&gt; &lt;p id="profesor"&gt; Wainblat Gabriela&lt;/br&gt; Nistor Ancuta&lt;/br&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; </code></pre>