you can try using rows/columns? i'd recommend wrapping each table in a col-md-6 div so that they'd stack on top of each other on smaller screens, which is more preferable/readable than trying to squeeze them next to each other.
<div class="row">
<div class="col-md-6">
table 1
</div>
<div class="col-md-6">
table 2
</div>
</div>
example:
| HEADING1 |
HEADING2 |
- List item 1
- List item 2
- List item 3
|
- List item 1
- List item 2
- List item 3
|
| HEADING1 |
HEADING2 |
- List item 1
- List item 2
- List item 3
|
- List item 1
- List item 2
- List item 3
|