Space between two rows in bootstrap table

Question

How to add space between two bootstrap table rows?

I need somehow like:

---------
| A   B |
---------
---------
| C   D |
---------
---------
| E   F |
---------

See Code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" />

<table class="table table-dark">
  <tbody>
    <tr>
      <td>Text</td>
      <td>Text</td>
    </tr>
    <tr>
      <td>Text</td>
      <td>Text</td>
    </tr>
    <tr>
      <td>Text</td>
      <td>Text</td>
    </tr>
  </tbody>
</table>

The styles border-collapse: separate; and border-spacing:0 20px; will work when I add the class table-bordered in the table, by that I will get a line between two columns which I don't need!

Solution

Set border-collapse and border-spacing...

.table {
    border-collapse: separate;
    border-spacing:0 20px;
}

https://www.codeply.com/go/76fzFtggt2

Comments

[Bacha]

As your code will work if I add the class table-bordered in it. But then I will also get a line between two columns which I don't need!