Is there a way to create space between two bootstrap table rows?
I am looking for something like this:
---------
| A B |
---------
---------
| C D |
---------
---------
| E F |
---------Here is the code snippet:
<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>If I add the class
table-borderedto the table along with stylesborder-collapse: separate;andborder-spacing:0 20px;, it will create a line between columns which might not be desired.