Văn bản nút tràn đang được cắt bớt trong safari

Question

Tôi có một thẻ nút đơn giản và tôi đặc biệt muốn văn bản tràn nút. Tính năng này hoạt động tốt trong các trình duyệt hiện tại ngoại trừ Safari (ios và osx) sẽ nén văn bản ở ranh giới nút.

button, 
 
.button { 
 
    width: 100px; 
 
    overflow: visible; 
 
    white-space: nowrap; 
 
    text-overflow: 'clip'; 
 
    text-align: left; 
 
    -webkit-appearance: none; 
 
    background: none; 
 
    border: none 
 
}

<button>Very long text Very long text Very long text This Clips In Safari</button> 
 
<div class='button'>Very long text Very long text Very long text This Overflows</div>

tôi không thể tìm ra cách để có được những văn bản để tràn. Có ai biết cách thực hiện công việc này không. TIA

Answer 1

Đây là CSS hợp lệ cho Safari:

text-overflow: ''; 

Sử dụng này để tương thích qua trình duyệt:

text-overflow: clip; 

Xem này để biết chi tiết:

https://developer.mozilla.org/en/docs/Web/CSS/text-overflow

Cũng không chắc mục đích củalà gìTôi đã đặt nó thành hidden.

Answer 2

Vì vậy, cuối cùng tôi đã tìm được một công việc xung quanh.

Nếu tôi quấn văn bản trong một khoảng và sau đó đặt khoảng cách thành vị trí: tương đối văn bản tràn sẽ hiển thị chính xác mà không bị cắt bớt.

Cũng lưu ý đề xuất ở trên để sử dụng tràn văn bản: clip sai, không ảnh hưởng đến điều này và tràn văn bản: '' hợp lệ.