CODEWITHSUNDEEP
javascripthtmlcss
The Truth
The Truth

Reputation: 167

HTML text input with fixed width and auto resizing height

I am wondering how to make a text input in html have a fixed width (100% of the parent or whatever - that is not really important) but as you type more the height changes to accommodate the text.

This seems to be common but I could not find any tutorial and dont have any idea how it is made.

An example of this resizing input would be Google Keep (when you write a memo): This is what it looks like when you write a little bit of text and this after you write more than a line of text.

Update: i have found a js lib that does that but would still appreciate if anyone could tell me what the main important thing to change is. Like just height of the textfield calculated based on text length? I still don't know what are the basic operations (not browser specific fixes).

The js file is Autosize.

Upvotes: 2

Views: 3006

Answers (1)

Florin Toader
Florin Toader

Reputation: 337

Text inputs are always one line. What you want is something akin to a textarea element. The problem is, the textarea doesn't resize automatically by itself.

This was discussed before, maybe you can check this question?

Creating a textarea with auto-resize

Upvotes: 1

Related Questions