Bryan P
Bryan P

Reputation: 4202

How to make a <input type="text"/> scale with height as it receives more text

The text on the input goes to the right when the input receives too much text, how do you make it so that the input scales downwards to make all the text be seen

Upvotes: 0

Views: 2476

Answers (4)

Rishi Dua
Rishi Dua

Reputation: 2334

jQuery Autosize is a plugin to enable automatic height for textarea elements. It does exactly what you need.

It is really easy to use

http://www.jacklmoore.com/autosize/

Upvotes: 1

kayla
kayla

Reputation: 156

if you mean you want to adjust height of text area, write specific height and width with

<textarea rows="4" cols="50"></textarea>

Then you'll get scroll bar on the right side.

Upvotes: 1

Dan M
Dan M

Reputation: 1785

The right element to use for this is a <textarea>. <input type="text"> doesn't allow line breaks in its content, so it can never wrap to a second line.

Upvotes: 6

priyolahiri
priyolahiri

Reputation: 678

input type text is always single line. you can use for multi-line and you can specify rows and columns. Look at this: http://css-tricks.com/textarea-tricks/ for auto resizing textareas and other tricks.

Upvotes: 2

Related Questions