thêm chiều cao tối thiểu cho nhiều cột CSS3

Question

Bạn có thể thêm chiều cao tối thiểu cho nhiều cột CSS3 không?

Tôi muốn có một cột đơn khi văn bản chỉ có bốn dòng thay vì bắt buộc một dòng trên cột thứ hai.

Ví dụ tôi thà:

Lorem ipsum dolor sit amet 
sodales id ipsum ipsum mauris 
interdum qui congue 
nisl quis, turpis tristique 

Không này:

Lorem ipsum dolor sit amet  nisl quis, turpis tristique 
sodales id ipsum ipsum mauris 
interdum qui congue 

Bất cứ lời khuyên?

Answer 1

Không có chiều cao tối thiểu, nhưng số lượng tối thiểu các dòng ở cuối một đoạn của riêng chúng ở đầu cột được gọi là orphans (và ngược lại ... dòng của riêng chúng khi bắt đầu một đoạn văn là widows). Đây là các thuộc tính CSS mà cột phải tôn trọng theo số spec, nhưng tôi đã thực hiện một thử nghiệm nhanh trong Chrome và nó không tạo ra bất kỳ sự khác biệt nào. Vì vậy, tôi đoán chúng ta phải chờ đợi điều này được thực hiện.

Một ví dụ về nó như thế nào nên được thiết lập:

p.columns { 
    column-count: 2; 
    orphans: 3 
} 

Answer 2

Min-height trong cột hiện đang được hỗ trợ bởi trình duyệt IE 10 và Firefox. Trong Webkit Tuy nhiên các văn bản tràn bên phải bên ngoài container như được giải thích đã có trong báo cáo lỗi này hai Bug#55740 Bug#65691

Answer 3

tôi biết, đây là một cái cũ. Nhưng trong quá trình nghiên cứu của tôi, chủ đề này xuất hiện đầu tiên, vì vậy tôi nên chia sẻ kết quả của mình tốt hơn. Có một thuộc tính partial supported được gọi là column-fill thuộc tính nào, những gì bạn và tôi đang tìm kiếm. phương tiện một phần, bạn nên sử dụng các tiền tố trình duyệt cụ thể ...

column-count: 2; 
column-width: auto; 
column-fill: auto; 

Sau đây là các MDN Docs