title: HTML - Spacing between rows in table
body: <p>I have a table that uses rowspan to combine 2 rows. I want the spacing between the 2 non combined rows to be closer whilst maintaining a larger spacing between the overall rows. For example, I would like <code>row1 col1</code> and <code>row2 col1</code> to be spaced closer together whilst having a larger space between <code>row2 col1</code> and <code>row3 col1</code>. This would apply to each overall row.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>table {
      border-collapse: collapse;
  }
  
  td {
      border-bottom: 1px solid black;
  }
  
  .noborder {
   border:none;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;table&gt;
   &lt;tr&gt;
    &lt;td class="noborder"&gt;row1 col1&lt;/td&gt;
    &lt;td rowspan=2&gt;merge col2&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
    &lt;td&gt;row2 col1&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
    &lt;td class="noborder"&gt;row3 col1&lt;/td&gt;
    &lt;td rowspan=2&gt;merge col2&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
    &lt;td&gt;row4 col1&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
    &lt;td class="noborder"&gt;row6 col1&lt;/td&gt;
    &lt;td rowspan=2&gt;merge col2&lt;/td&gt;
   &lt;/tr&gt;
   &lt;tr&gt;
    &lt;td&gt;row6 col1&lt;/td&gt;
   &lt;/tr&gt;
  &lt;/table&gt;</code></pre>
  </div>
  </div>
  </p>