Question

How do I move text to a new line in an HTML input element with the type="button" attribute?

I have following code:

<input type="button" id="btnTexWrapped" value="I see this is a long sentence here." style="width: 200px;" />

I want the button’s text value to be wrapped in two lines. I tried typing it into the next line in HTML. It didn’t work as I expected:

<input type="button" id="btnTexWrapped" value="I see this is a long 
sentence here." style="width: 200px;" />

I also tried using all options of white-space with fixed width: 200px;, but still nothing works.

I am OK with statically fixing the length, width, or other values: as the control is not going to change.

Answer 1

Try this, you can see how it works instantly:

<input type="button" value="Carriage&#13;&#10;return&#13;&#10;separators" style="text-align:center;">