RMN RMN - 7 months ago 8
HTML Question

Wrapping an HTML input button's text value over multiple lines

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

Try this, you can see how it works instantly:

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