Multiple lines in ion-button

Ionic Framework ionic-v3
1

How can I implement multiple lines in an ion-button like a regular button does?

image

Here’s the code:

  <button>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
  </button>

  <br>

  <button ion-button>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
    multiple lines
    <br>
  </button>
2 Likes
2

Your code is correct for Multiple lines in ion-button but only thing is you need to override the button height in css.

1 Like
3

How do I make the height resize itself to fit its content like a regular button, though?

4

Add this to your Button

.button-inner {
  flex-flow: column;
}
2 Likes
5

Hello, how about content without br tag?

6

thank you very much. i just saw your response