Cách đặt bảng ở giữa

Học cách sử dụng CSS để đặt bảng ở giữa.

Bảng ở giữa:

Firstname Lastname Age
Jill Smith 50
Eve Jackson 94
John Doe 80

Cách để đặt bảng ở giữa

Bước 1 - Thêm HTML:

<table class="center">
  <tr>
    <th>Firstname</th>
    <th>Lastname</th>
    <th>Age</th>
  </tr>
  <tr>
    <td>Jill</td>
    <td>Smith</td>
    <td>50</td>
  </tr>
  <tr>
    <td>Eve</td>
    <td>Jackson</td>
    <td>94</td>
  </tr>
  <tr>
    <td>John</td>
    <td>Doe</td>
    <td>80</td>
  </tr>
</table>

Bước 2 - Thêm CSS:

Để đặt bảng ở giữa, hãy đặt mép trái phải thành tự động:

.center {
  margin-left: auto;
  margin-right: auto;
}

thử trực tiếp

Lưu ý, nếu độ rộng được thiết lập là 100% (toàn rộng), bảng không thể được căn giữa.

Trang liên quan

Giáo trình:Bảng CSS