# How to realize the function that perspective button text line break？

**URL:** <https://forum.inductiveautomation.com/t/how-to-realize-the-function-that-perspective-button-text-line-break/105954>\
**Category:** Ignition\
**Tags:** ignition81, perspective\
**Created:** [May 7, 2025, 5:47am UTC](https://forum.inductiveautomation.com/t/how-to-realize-the-function-that-perspective-button-text-line-break/105954 "2025-05-07T05:47:57Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![ywang142](https://avatars.discourse-cdn.com/v4/letter/y/41988e/32.png) [@ywang142](https://forum.inductiveautomation.com/u/ywang142)\
**Post date:** [May 7, 2025, 5:47am UTC](https://forum.inductiveautomation.com/t/how-to-realize-the-function-that-perspective-button-text-line-break/105954/1 "2025-05-07T05:47:57Z")

</div>

I knew in ignition 7.9 it can work with   
, but I try this way in 8.1, seem the html render can't work, does someone know?

---

<div class="post-metadata">

**Author:** ![hunterdg](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/hunterdg/32/67774_2.png) [@hunterdg](https://forum.inductiveautomation.com/u/hunterdg)\
**Post date:** [May 7, 2025, 5:56am UTC](https://forum.inductiveautomation.com/t/how-to-realize-the-function-that-perspective-button-text-line-break/105954/2 "2025-05-07T05:56:49Z")

</div>

`\n` + textstyle.whiteSpace: pre

---

<div class="post-metadata">

**Author:** ![ywang142](https://avatars.discourse-cdn.com/v4/letter/y/41988e/32.png) [@ywang142](https://forum.inductiveautomation.com/u/ywang142)\
**Post date:** [May 7, 2025, 6:13am UTC](https://forum.inductiveautomation.com/t/how-to-realize-the-function-that-perspective-button-text-line-break/105954/3 "2025-05-07T06:13:57Z")

</div>

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/2/42f399ad098ae412531f0be705b251ad5e287335.png)  
still can't work

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [May 7, 2025, 9:02am UTC](https://forum.inductiveautomation.com/t/how-to-realize-the-function-that-perspective-button-text-line-break/105954/4 "2025-05-07T09:02:49Z")

</div>

I can't get the \n to work directly in the Perspective Property Editor.

**Workaround 1**

 ![text editor](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/2/c25dd5bdf4888b915bdc3db15038552131dfee0c.png)

- Add enough text into the `text` property so that the 'Edit Long/Multiline Text' button appears.
- Enter the line breaks manually.
- Add `readyState.style.whiteSpace : pre`.

**Workaround 2**

 ![Button line wrap](https://us1.discourse-cdn.com/inductiveautomation/original/3X/8/f/8f096987d73b4343493f9dcca911924b70517f0e.png)

- Newlines in an expression seem to get converted properly.
- Add `readyState.style.whiteSpace : pre`.

---

<div class="post-metadata">

**Author:** ![ywang142](https://avatars.discourse-cdn.com/v4/letter/y/41988e/32.png) [@ywang142](https://forum.inductiveautomation.com/u/ywang142)\
**Post date:** [May 7, 2025, 3:08pm UTC](https://forum.inductiveautomation.com/t/how-to-realize-the-function-that-perspective-button-text-line-break/105954/5 "2025-05-07T15:08:26Z")

</div>

Wow, it works, thanks
