Điều đó không phải là khoa trương: Tôi thực sự quan tâm đến việc tìm ra các trường hợp sử dụng tuyệt vời cho các bố cục nhiều cột trong CSS.
Câu trả lời có vẻ đơn giản. Sử dụng các cột khi bạn muốn chia bất kỳ nội dung nào thành các cột, phải không? Đây thường là loại ví dụ bạn sẽ tìm thấy trong các bài viết cho thấy cách hoạt động của bố cục cột đột biến CSS, bao gồm cả Niên giám:
Đúng rồi. Nhưng đây có phải là một trường hợp sử dụng thực tế? Có lẽ. Nếu văn bản tương đối ngắn gọn, thì có lẽ đó là một liên lạc tốt. Đó là cách tôi bán nó cho chính mình khi thiết kế lại trang web của mình vài năm trước. Hôm nay không phải như vậy, nhưng lúc đó nó trông như thế này:
Nhưng toàn bộ một bài báo dạng dài được chia thành nhiều cột? Tôi thích nó trên báo nhưng do dự khi cuộn trang web xuống để đọc một cột, và chỉ cuộn lên để làm lại.
Tôi cho rằng chúng ta có thể sử dụng nó để đặt hai phần tử cạnh nhau, nhưng flexbox phù hợp hơn cho điều đó. Thêm vào đó, một hạn chế ngăn chúng tôi chọn các cột để định kích thước riêng lẻ. Các cột phải có cùng chiều rộng.
Một điều mà các cột có lợi cho chúng là chúng là phương pháp bố cục CSS duy nhất những mảnh vỡ Nội dung. (Đó là, trừ khi chúng ta đang đếm Khu vực CSS… Dù sao thì chuyện gì đã xảy ra với những cái đó ?!) Vì vậy, nếu bạn muốn chia một đoạn văn thành các cột, bạn có thể thực hiện được mà không cần thêm trình bao bọc.
Khi nào khác, bạn có thể cần chia một khối nội dung liên tục thành các cột? Tôi nhớ cần phải làm điều đó khi tôi có một danh sách lớn các mục không có thứ tự. Tôi thích cách danh sách có thể làm cho nội dung dễ dàng quét, nhưng danh sách dài có thể khiến một bên của trang trông rất nặng. Ví dụ, giả sử rằng chúng tôi đã liệt kê tất cả các thẻ bài đăng cho CSS-Tricks trong các nhóm chữ cái. Bố cục nhiều cột hoạt động tuyệt vời cho điều đó:
Hãy tiếp tục và thử thay đổi kích thước chiều rộng khung nhìn. Ba cột được xác định nhưng số lượng sẽ thay đổi dựa trên lượng không gian có sẵn. Gotta yêu tất cả những gì tốt đẹp đáp ứng mà không cần công việc truy vấn phương tiện truyền thông!
Tôi đang làm việc trên một bản demo cho :left lớp giả và đạt đến columns bởi vì đó là một cách tuyệt vời để phân mảnh mọi thứ để in các bản trình diễn. Vì vậy, tôi đoán có một trường hợp sử dụng khác. Và trong khi tạo bản demo, tôi nhận ra rằng bố cục nhiều cột có thể được sử dụng để tạo ra một lưới các mục, giống như một thư viện hình ảnh:
Nhưng còn gì nữa? Chúng ta có bị giới hạn trong các đoạn văn ngắn, danh sách dài và lưới di chuyển tự do không?
