# Perspective: How can I hide a tab in a tab container?

**URL:** <https://forum.inductiveautomation.com/t/perspective-how-can-i-hide-a-tab-in-a-tab-container/44890>\
**Category:** Ignition\
**Created:** [March 25, 2021, 4:53am UTC](https://forum.inductiveautomation.com/t/perspective-how-can-i-hide-a-tab-in-a-tab-container/44890 "2021-03-25T04:53:28Z")\
**Posts on this page:** 1\
**Showing post:** 8

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [May 12, 2022, 12:20pm UTC](https://forum.inductiveautomation.com/t/perspective-how-can-i-hide-a-tab-in-a-tab-container/44890/8 "2022-05-12T12:20:07Z")

</div>

I don’t think there’s a built-in way to achieve this right now, but it can be done with css injection.  
See [this thread](https://forum.inductiveautomation.com/t/ign-2207-is-there-a-way-to-stop-intercept-a-tab-container-tab-change/45214/16).

I see two ways:  
Make a style class for each one of the tabs you want to hide (`hide_tab1`, `hide_tab2`, etc).  
In each of those style classes, put this in the `background-position` property (or any other property that lets you type things): `} .psc-hide_tabX .tab-menu-item[data-index="X-1"] {display: None } {`  
Of course you’ll have to change that to match the class and tab:  
for tab 2 it will be `} .psc-hide_tab2 .tab-menu-item[data-index="1"] {display: None } {`,  
for tab 3 `} .psc-hide_tab3 .tab-menu-item[data-index="2"] {display: None } {`  
etc.  
Then add the appropriate classes to your tab container’s style when changing views/doing whatever triggers the hiding of some tabs.

solution 2:  
Add a custom property on your tab container to store the indices of the tabs you want to hide. You’ll have to update this property whenever you need to hide/display tabs.  
Add any property to the tab container’s style, and bind it to your custom property.  
then add a script transform, and put this in:

```python
return "}} {} {{display: None }} {{".format(', '.join(".tab-menu-item[data-index='{}']".format(tab) for tab in value))

```

note that the tab indices are 0-based. If you’re putting 1-based indices in the custom prop, you’ll need to adjust them.

---

_[View the full topic](https://forum.inductiveautomation.com/t/perspective-how-can-i-hide-a-tab-in-a-tab-container/44890)._