Có tràn văn bản CSS: dấu ba chấm hoạt động trên các thẻ Anchor không?

Question

Tại sao CSS sau không hoạt động?

a { 
    width: 60px; 
    overflow: hidden; 
    white-space: nowrap; 
    text-overflow: ellipsis; 
} 

Answer 1

Đó là do neo là tiêu chuẩn, inline yếu tố. Thêm display:inline-block sẽ làm cho mã trên hoạt động.

Answer 2

Đó là đối với mô hình hộp, display:block sẽ làm công việc

a { 
    width: 60px; 
    display:block; 
    overflow: hidden; 
    white-space: nowrap; 
    text-overflow: ellipsis; 
}​ 

Nhưng nó có thể làm cho quý vị những vấn đề khác để làm cho neo (yếu tố inline) cư xử như yếu tố mô hình hộp (display: block).

tham khảo:text-overflow

Cập nhật:

display:inline-block 

Demo.

Answer 3

Thêm display: block để css của bạn.