title: Simulating rowspan with css and divs?
body: <p>Hi I am trying to simulate the rowspan property on css using divs and  tags, so it can be changed on a:active = double height, but at the moment it grows from two rows to three rows.</p>
  
  <p>It only works when the first column its expanded, if I expand the second, third, etc then it would grow to three rows.</p>
  
  <p>Here its the sample code that works, and it remains in two rows.</p>
  
  <pre><code>&lt;div style="float:left;width:750px;text-align:center;height:30px;"&gt;
  
     &lt;a href="#" style="float:left;width:149px;height:30px;"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;2&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;3&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;4&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px;"&gt;5&lt;/a&gt;
  
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But If I do the following :</p>
  
  <pre><code>&lt;div sytle="width:750px;text-align:center;height:30px;float:left"&gt;
  &lt;!--Row 1----&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px;height:30px;"&gt;2&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;3&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;4&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px;"&gt;5&lt;/a&gt;
  &lt;!--Row 2----&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
     &lt;a href="#" style="float:left;width:149px"&gt;1&lt;/a&gt;
   &lt;/div&gt;
  </code></pre>
  
  <p>Then it would grow to three rows.</p>
  
  <p>What I am trying to do its a two row tabs, so when you select the one at the top it would expand the row to indicate that its been selected.</p>
  
  <p>Because there are 5 elements at the top and 4 in the bottom, when you select the one at the top its when it needs to expand taking the space of the missing element below. </p>