Cho phép phần tử văn bản thay đổi kích cỡ thu nhỏ (không chỉ tăng trưởng) từ kích thước ban đầu/mặc định

Question

Tôi đang cố tạo phần tử textarea có kích thước mặc định/mặc định được lập trình, nhưng người dùng có thể thay đổi kích thước trong giới hạn đã xác định cho phép nó phát triển và thu nhỏ.

Tôi đã cố gắng thiết lập các resize, min-width, max-width, và width thuộc tính của text-khu vực, nhưng, cho đến nay, điều này chỉ cho phép người dùng phát triển yếu tố textarea, không teo nó. Trình duyệt sẽ cho phép người dùng định kích thước và thay đổi kích thước phần tử trong các giới hạn của width và max-width, không nằm giữa các giới hạn của min-width và max-width, như dự định.

Có cách đơn giản để chỉ định kích thước mặc định cũng sẽ không được coi là một kích thước tối thiểu tối thiểu không?

---

Đây là mã tôi đang làm việc với:

function textAreaWithDefault(size) { 
    var ta = document.createElement("textArea"); 

    ta.style.resize = "both"; 
    ta.style.minWidth = "100px"; 
    ta.style.width = size + "px"; // default size 
    ta.style.maxWidth = "500px"; 

    document.body.appendChild(ta); 
} 

Một css tinh khiết và/hoặc javascript giải pháp được ưa chuộng, nhưng nó chỉ có làm việc trên web-kit.

Answer 1

Cố gắng thiết lập min-width bằng max-width và chiều rộng để 0

Answer 2

tôi sẽ nhìn vào fittext hoặc tương tự kịch bản: http://fittextjs.com/

này thực hiện chính xác những gì bạn đang mô tả.