# Button icon size and position with multiline text?

**URL:** <https://forum.inductiveautomation.com/t/button-icon-size-and-position-with-multiline-text/78215>\
**Category:** Ignition\
**Tags:** ignition81, perspective\
**Created:** [August 22, 2023, 11:37am UTC](https://forum.inductiveautomation.com/t/button-icon-size-and-position-with-multiline-text/78215 "2023-08-22T11:37:24Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![mazeyrat](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mazeyrat/32/10955_2.png) [@mazeyrat](https://forum.inductiveautomation.com/u/mazeyrat)\
**Post date:** [August 22, 2023, 11:37am UTC](https://forum.inductiveautomation.com/t/button-icon-size-and-position-with-multiline-text/78215/1 "2023-08-22T11:37:24Z")

</div>

with the button component, with multiline text, the icon is resized and the position is not good.  
Is there any style properties to better adjust icon size and position in this case ?

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/1/41b6194fee4fe31e8852253cd575428170fafd4a.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/b/cb97773e2c1eba8f68f6e8366ea9893f6ee1f4cc.png)

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/0/803efc04146fa950ad0e38b52916c910c08d5933.png)

---

<div class="post-metadata">

**Author:** ![Priyanka.Khandge](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/priyanka.khandge/32/35989_2.png) [@Priyanka.Khandge](https://forum.inductiveautomation.com/u/Priyanka.Khandge)\
**Post date:** [August 22, 2023, 11:57am UTC](https://forum.inductiveautomation.com/t/button-icon-size-and-position-with-multiline-text/78215/2 "2023-08-22T11:57:08Z")

</div>

try to set grow, shrink, and basis like below

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/f/ef73b917772b993d149a0ea71319f95a9a568539.png)

---

<div class="post-metadata">

**Author:** ![mazeyrat](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mazeyrat/32/10955_2.png) [@mazeyrat](https://forum.inductiveautomation.com/u/mazeyrat)\
**Post date:** [August 22, 2023, 12:02pm UTC](https://forum.inductiveautomation.com/t/button-icon-size-and-position-with-multiline-text/78215/3 "2023-08-22T12:02:23Z")

</div>

I don't want to change the button size, but to keep a multi line text with a correct icon

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [August 22, 2023, 1:10pm UTC](https://forum.inductiveautomation.com/t/button-icon-size-and-position-with-multiline-text/78215/4 "2023-08-22T13:10:36Z")

</div>

You can increase the width and height of the icon.  
And add a paddingLeft to the whole button  
(exaggerated example)

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/4/a4d3f3d89c4e1050c1474bfbb8236dde5963a5a3.png)

---

<div class="post-metadata">

**Author:** ![mazeyrat](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/mazeyrat/32/10955_2.png) [@mazeyrat](https://forum.inductiveautomation.com/u/mazeyrat)\
**Post date:** [August 22, 2023, 1:28pm UTC](https://forum.inductiveautomation.com/t/button-icon-size-and-position-with-multiline-text/78215/5 "2023-08-22T13:28:08Z")

</div>

Thanks 👍