Here is a problem I am facing.
It seems that the table inside the card is not displaying correctly. I want the table to be centered or at least eliminate the blank space that is currently showing. Here is my code (using Angular 6):
<div class="row">
<div class="col-md-6">
<div class="header">
<h4 style="padding:10px" class="title">Dispositivo de Ejecucion</h4>
</div>
<div>
<table class="table table-bordered table-condensed table-responsive ">
<thead class="thead-dark">
<tr>
<th>Marca</th>
<th>Sistema Operativo</th>
<th>Version</th>
<th>Modelo</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{dispositivoCdp[0].nombredispositivo}}</td>
<td>{{dispositivoCdp[0].sistema_operativo}}</td>
<td>{{dispositivoCdp[0].version}}</td>
<td>{{dispositivoCdp[0].modelo}}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="col-md-6 justify-content-center">
<div class="header">
<h4 style="padding:10px" class="title">Tiempo de Ejecucion</h4>
</div>
<table class=" table table-bordered table-responsive ">
<thead class="thead-dark">
<tr>
<th>Inicio</th>
<th>Fin</th>
<th>Duracion</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{dispositivoCdp[0].nombredispositivo}}</td>
<td>{{dispositivoCdp[0].sistema_operativo}}</td>
<td>{{dispositivoCdp[0].version}}</td>
</tr>
</tbody>
</table>
</div>
</div>
Any suggestions on what I might be doing wrong? I have tried using table-sm inside the table class but have not seen any results.