# Problem popup header overflow

**URL:** <https://forum.inductiveautomation.com/t/problem-popup-header-overflow/97533>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [October 21, 2024, 6:41am UTC](https://forum.inductiveautomation.com/t/problem-popup-header-overflow/97533 "2024-10-21T06:41:48Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jasper\_Clauwaert](https://avatars.discourse-cdn.com/v4/letter/j/ac91a4/32.png) [@Jasper\_Clauwaert](https://forum.inductiveautomation.com/u/Jasper_Clauwaert)\
**Post date:** [October 21, 2024, 6:41am UTC](https://forum.inductiveautomation.com/t/problem-popup-header-overflow/97533/1 "2024-10-21T06:41:49Z")

</div>

Hi,

**Context:**  
I'm trying to open a popup using an event script when clicking a component:

```python
def runAction(self, event):
	       system.perspective.togglePopup(
	       id=self.view.custom.PopupID,
	       title=self.view.custom.tag + ' - ' + self.view.custom.description,
	       view='Templates_HighPerformance/Popups/Regulator/PopUp_Regulator_test',
	       params = {'PopupID':self.view.custom.PopupID,'TagPath':self.view.params.tagPath},
           resizable='false',
           position = {'top':event.pageY,'left':event.pageX}
	       )

```

Now when opening this popup it looks like this with a long title:

 ![Screenshot popup](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/b/5b8d3c6925e647c93ac57f717399414377805dff.png)

When using a shorter title it looks like this (how it's supposed to be):

 ![Screenshot popup2](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/0/d0b4743bfd3496db1e0b08a81d10c25a3f58410e.png)

When clicking the button, the popup expands to the right (this works).

**Question:**  
How/where can I edit or add CSS code to hide the title when there is overflow in the header. Or is there any possible solution to fix this problem?

---

<div class="post-metadata">

**Author:** ![Nathan\_Moore](https://avatars.discourse-cdn.com/v4/letter/n/d78d45/32.png) [@Nathan\_Moore](https://forum.inductiveautomation.com/u/Nathan_Moore)\
**Post date:** [October 21, 2024, 8:03am UTC](https://forum.inductiveautomation.com/t/problem-popup-header-overflow/97533/2 "2024-10-21T08:03:52Z")

</div>

Yeah I would try target the header of the popup with css and add.

Whitespace: 'nowrap'  
textOverflow: 'ellipsis'

you can edit the css with the advanved stylesheet.

> [@New Stylesheet resource](https://forum.inductiveautomation.com/t/new-stylesheet-resource/64787):
>
> Starting with the 10/4/2022 Nightly (8.1.22) build, users will be able to modify a new styling resource: stylesheet.css This new resource is considered an advanced feature and will not be in place by default. To place the resource, expand the Perspective node of the Project Browser, right-click the Styles node, and select "Enable Advanced Stylesheet". [EnableStylesheet] Once in place, the stylesheet allows for inserting CSS just as you would in any normal CSS file. The rules defined in this r…