How to newline in HTML Button?

Question

Hello guys how to newline or break inside a input button?. I have this code:

<input type="button" id="Button" value="RECOMMEND DISAPPROVE" disabled="disabled" style="width:125px; height: 35px;"/>

I tried <br/> but not working..

Sorry for being beginner but i'm using this button to disapprove a request but word "RECOMMEND" is all i can see. — Traf De Law, Jun 27 '16 at 07:30
You can make a line break using the CSS `word-break` property or CSS `flex-wrap`property. Find how to use them here: [How to Create Button with Line Breaks](https://www.w3docs.com/snippets/html/button-with-line-breaks.html) at W3docs — Astghik Arakelyan, Jan 11 '19 at 10:49

score 5 · Accepted Answer · answered Jun 27 '16 at 07:31

5

You may want to use the <button> attribute as <input> doesn't support the newline tags. So you could do this for example:

<button type="button" id="Button" disabled="disabled" style="width:125px; height: 35px;">RECOMMEND<br />DISAPPROVE</button>

You may want to remove the button width/height as the text doesn't fit well in the button

I hope this will help you.

answered Jun 27 '16 at 07:31

node_modules

You're welcome! If this solution worked for you, you can accept this answer as solved if you want to :-) – node_modules Jun 27 '16 at 07:42
@YurkZ Under the votes from this answer, you see a gray mark, of you click on it you will mark this answer as solved :-) – node_modules Jun 27 '16 at 07:50

score 4 · Answer 2 · answered Jun 27 '16 at 07:32

4

<button>Line one<br/>line two</button>

It appears <input type="button"> doesn't support line breaks

answered Jun 27 '16 at 07:32

Anthony Astige

2 Answers2