title: Border-top from tbody and border-bottom from thead don't work at the same time?
body: <p>I have  a very basic table:</p>
  
  <pre><code>&lt;table id="ttable5" class="table-default"&gt;
          &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt;Nombre&lt;/th&gt;
                  &lt;th class="sort-date"&gt;Provincia&lt;/th&gt;
              &lt;th class="sort-digit"&gt;Municipio&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
  
              &lt;td class="tablaprim"&gt;1VESTIBULUM TORTOR NISL &lt;/td&gt;
              &lt;td&gt;Sevilla&lt;/td&gt;
              &lt;td&gt;Castilleja de la Cuesta&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
  
              &lt;td class="tablaprim"&gt;4VESTIBULUM TORTOR NISL &lt;/td&gt;
              &lt;td&gt;Sevilla&lt;/td&gt;
              &lt;td&gt;Castilleja de la Cuesta&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>I need to have this:</p>
  
  <pre><code>------------
  head
  ------------1px border #fff
  ------------3px border #gray
  body
  ------------
  </code></pre>
  
  <p>I can only get to show one of the borders, never two at the same time. It's not really important but I'm curious about what is causing this issue.</p>
  
  <p>My css:</p>
  
  <pre><code>thead{border-bottom: 1px solid #fff;}
  tbody{border-top: 3px solid #4d4d4d;}
  </code></pre>
  
  <p>EDIT: </p>
  
  <p>Since it seems like the border-collapse might be the issue but I can't make it work I've set up this sandbox:</p>
  
  <p><a href="http://jsfiddle.net/bRVEu/" rel="noreferrer">http://jsfiddle.net/bRVEu/</a></p>
  
  <p>There you can see there's only a grey border, there should be a 1px white border right on top of it</p>