Ответ 1
Вам не хватает margin:auto
.table {
border-radius: 5px;
width: 50%;
margin: 0px auto;
float: none;
}
Я пытаюсь центрировать таблицу с помощью бутстрапа.
Вот html:
<div class="container-fluid">
<table id="total votes" class="table table-hover text-centered">
<thead>
<tr>
<th>Total votes</th>
<th> = </th>
<th>Voter A</th>
<th> + </th>
<th>Voter B</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ total_votes }}</td>
<td> = </td>
<td>{{ total_voter_a }}</td>
<td> + </td>
<td>{{ total_voter_b }}</td>
</tr>
</tbody>
</table>
</div>
Однако, независимо от того, как я настраиваю css
, таблица по-прежнему выравнивается влево. Я уверен, что мне не хватает чего-то простого. Я также думал, что container-fluid
сделает стол по всей странице.
вот css:
.table th {
text-align: center;
}
.table {
border-radius: 5px;
width: 50%;
float: none;
}
Вам не хватает margin:auto
.table {
border-radius: 5px;
width: 50%;
margin: 0px auto;
float: none;
}
Измените свой CSS на:
table{
margin: 0 auto
}