How to force single line in a HTML textarea element?

Question

Is there a way to make a HTML textarea element to allow only one line?

I want to do this because I will have a button to expand it, but if user is allowed to enter multiple lines when the textarea is not expanded (only 1 row) it doesn look very nice, and if I use a textbox for the not expanded state, it looks weird when I replace it with the textarea and expand it with animation.

Answer 1

No.

You can stack the elements, then show the textarea first and remove the textbox right away. I guess it would be the workaround.

Example on how to stack elements on jsFiddle.

Answer 2

You can put jQuery to use to create such field effect. See the demo here.

http://www.9lessons.info/2010/03/facebook-like-expanding-textbox-with.html

Answer 3

As far as I know you'd need to use javascript to monitor and prevent the enter key.

Answer 4

Very similar question to this one

http://stackoverflow.com/questions/657795/how-remove-wordwrap-from-textarea

Answer 5

Not in plain HTML, however, if you use JavaScript you could do it.