How to make a <input> tag multi line?

Question

I would like to know if is possible to make a <input> tag with appearance like multi-line (similar to the <TEXTAREA></TEXTAREA>) using CSS or another option, unfortunately I can replace the tag with in my web application.

   <input id="uxMessage" validation="required" name="uxMessage" type="text" />

Many Thanks

Answer 1

<input type="text" /> will always only be one line; You cannot force a multiple line behavior with CSS or JavaScript. You will need to use a <textarea> instead of a <input>.

You could use jQuery and it's .replaceWith() method to replace the targeted <input> with a <textarea>. however this has obvious caveats, such as those who visit your page without JavaScript on.

Example:

<input id="uxMessage" validation="required" name="uxMessage" type="text" />

$("#uxMessage").replaceWith('<textarea id="uxMessage" name="uxMessage"></textarea>');