Line break in a submit button


<input type='submit' value='[COLOR=Red]my button[/COLOR]'>

I have a submit button like the above.

I like to put a line break between my and button.

If I use an image, I can make it, but I like to make it with text.

The following would-be code doesn’t work correctly, but it will show what I want.

[COLOR=Blue][b]would-be code[/b][/COLOR]

<input type='submit' value='[COLOR=Red]my[/COLOR] <br> [COLOR=Red]button[/COLOR]'>

[COLOR=Blue][b]browsing result[/b][/COLOR]

[COLOR=Red]my[/COLOR] <br> [COLOR=Red]button[/COLOR]


[COLOR=Blue][b]target result[/b][/COLOR]

[COLOR=Red]my[/COLOR]
[COLOR=Red]button[/COLOR]

Can I do it in javascript with your help?

Try

<input type='submit' value='my \
 button'>

You can’t force line breaks in a submit button. You could try using two buttons and styling them to appear as one. You could try a <button> tag and using javascript to submit.

If this is really important I would use a normal submit button with unbroken text, then use javascript to replace it with a button tag with the line break. This way it will work perfectly with both javascript enabled or disabled, with only a slight aesthetic problem for those with it disabled.

:blush: Sorry, I was thinking of alerts confirms and prompts. Try

<input type="submit" value='top &#38;#10; bottom'>

It does work.

Put a literal line break in the source and set the
white space style of the element to ‘pre’ , either in a linked stylesheet or inline:

<input type="submit" value="My
  button" style="white-space:pre"/>

By the way, get in the habit of closing your tags:

<input type="submit" value="Submit" />

The best way too do this would be too use the button tag

<button type="submit">My<br />Button</button>

The code you need is

&#10;