Trung tâm nội dung

Kỹ thuật căn giữa chỉ có một vài dòng CSS, phù hợp với nhiều phần tử, nhưng có tác dụng phụ là làm cho phần tử con khớp với chiều rộng của phần tử rộng nhất.

Hãy xem bài viết đầy đủ để biết thêm thông tin chi tiết về kỹ thuật này và thời điểm kỹ thuật có hiệu quả.

Bài viết đầy đủ · Video trên YouTube · Nguồn trên GitHub

HTML

<article class="content-center">
  <h1>Content Center</h1>
</article>

CSS


        .content-center {
  display: grid;
  place-content: center;
  gap: 1ch;
}