# Menu Tree height in stylesheet

**URL:** <https://forum.inductiveautomation.com/t/menu-tree-height-in-stylesheet/98041>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [November 1, 2024, 11:39am UTC](https://forum.inductiveautomation.com/t/menu-tree-height-in-stylesheet/98041 "2024-11-01T11:39:04Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![EdG](https://avatars.discourse-cdn.com/v4/letter/e/f6c823/32.png) [@EdG](https://forum.inductiveautomation.com/u/EdG)\
**Post date:** [November 1, 2024, 11:39am UTC](https://forum.inductiveautomation.com/t/menu-tree-height-in-stylesheet/98041/1 "2024-11-01T11:39:05Z")

</div>

I'm new to perspective. I'm just trying to create a style to apply to a menu tree, so I can set amongst other things the height of the row to reduce the white space around the text. I can do it on a per item basis by adding a value "height" and setting the value in the style, but doing it on a per item basis will be unmanageable.  
I've created a style "NavMenu" to be used by all the relevant items, I can't see a way of controlling this in the regular style so moved to css. In css I can control the usual styles e.g. font-size, but I'm struggling to get the height to take the setting.

```python
.psc-NavMenu {
	font-size: 50px;
	height: 200;	
}

```

For the above the font size applies, but I'm missing something for the height. Any assistance appreciated!

---

<div class="post-metadata">

**Author:** ![ryan.perretta](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan.perretta/32/75110_2.png) [@ryan.perretta](https://forum.inductiveautomation.com/u/ryan.perretta)\
**Post date:** [November 1, 2024, 2:11pm UTC](https://forum.inductiveautomation.com/t/menu-tree-height-in-stylesheet/98041/2 "2024-11-01T14:11:06Z")

</div>

I'm not sure where you have this style class applied, but I tested with the `NavMenu` class applied in `itemStyle` and `style` properties. In both cases the height rule was being overwritten by another default style class for the menu tree.

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

I was able to get the rule from the custom style class to take precedence by adding the `!important` flag to the end of the height rule, as such

```css
.psc-NavMenu {
	height: 200px !important;
}

```

Still a bit strange because when I read the docs for the advanced stylesheet I thought it's rules would overwrite any default themes, but maybe I misread.

---

<div class="post-metadata">

**Author:** ![EdG](https://avatars.discourse-cdn.com/v4/letter/e/f6c823/32.png) [@EdG](https://forum.inductiveautomation.com/u/EdG)\
**Post date:** [November 1, 2024, 2:29pm UTC](https://forum.inductiveautomation.com/t/menu-tree-height-in-stylesheet/98041/3 "2024-11-01T14:29:47Z")

</div>

Awesome, that's sorted it, thanks!
