# \[FEATURE-16567\] Perspective Table Row Height

**URL:** <https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466>\
**Category:** Ignition Early Access\
**Created:** [March 26, 2020, 9:56pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466 "2020-03-26T21:56:00Z")\
**Posts on this page:** 17\
**Page:** 1

<div class="post-metadata">

**Author:** ![jpark](https://avatars.discourse-cdn.com/v4/letter/j/a88e57/32.png) [@jpark](https://forum.inductiveautomation.com/u/jpark)\
**Post date:** [March 26, 2020, 9:56pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/1 "2020-03-26T21:56:00Z")

</div>

What’s the proper way to set the row height in a Perspective table?  
I have tried:  
Rows \> style \> maxHeight:15  
Rows \> style \> height:!5  
without any success.

---

<div class="post-metadata">

**Author:** ![Steve\_Laubach](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/steve_laubach/32/60900_2.png) [@Steve\_Laubach](https://forum.inductiveautomation.com/u/Steve_Laubach)\
**Post date:** [April 1, 2020, 7:02pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/2 "2020-04-01T19:02:07Z")

</div>

If you add a “fontSize” property to the style for the table it will adjust the font size for the table. This will automatically change row widths.

ex. fontSize:20px

If you don’t put the “px” it will highlight red but still work.

Edit: I should have said you want to add fontSize to the style for the Rows. That’s rows.style.fontSize. You can add this property using the style editor.

---

<div class="post-metadata">

**Author:** ![Paul.Scott](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul.scott/32/4578_2.png) [@Paul.Scott](https://forum.inductiveautomation.com/u/Paul.Scott)\
**Post date:** [April 1, 2020, 7:09pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/3 "2020-04-01T19:09:36Z")

</div>

> [@jpark](#):
>
> What’s the proper way to set the row height in a Perspective table?

Don't know if it's proper, but `cells.style.height` seems to work.

---

<div class="post-metadata">

**Author:** ![WillMT10](https://avatars.discourse-cdn.com/v4/letter/w/7feea3/32.png) [@WillMT10](https://forum.inductiveautomation.com/u/WillMT10)\
**Post date:** [April 1, 2020, 7:10pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/4 "2020-04-01T19:10:29Z")

</div>

Try adding “minHeight” instead of “maxHeight” to the row styles and set it to something like 50.

Sorry, just realized you were trying to make it shorter than the default height…looks like maybe font size takes precedent. Definitely some weird behavior with maxHeight \<20.

---

<div class="post-metadata">

**Author:** ![dillonu](https://avatars.discourse-cdn.com/v4/letter/d/278dde/32.png) [@dillonu](https://forum.inductiveautomation.com/u/dillonu)\
**Post date:** [May 2, 2020, 5:34pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/5 "2020-05-02T17:34:37Z")

</div>

It seems the rows have a minHeight of 30px. If you try setting the height or minHeight of the cells to something less than 30, it will be capped to 30px.  
Is this something we can get around?

---

<div class="post-metadata">

**Author:** ![tyrel.parker](https://avatars.discourse-cdn.com/v4/letter/t/47e85d/32.png) [@tyrel.parker](https://forum.inductiveautomation.com/u/tyrel.parker)\
**Post date:** [May 28, 2020, 2:55pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/6 "2020-05-28T14:55:44Z")

</div>

Has anyone found a way around this?

---

<div class="post-metadata">

**Author:** ![ynejati](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ynejati/32/6093_2.png) [@ynejati](https://forum.inductiveautomation.com/u/ynejati)\
**Post date:** [May 28, 2020, 3:46pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/7 "2020-05-28T15:46:40Z")

</div>

You can’t, at least not easily. This was intentional. It’s there as a row virtualization measurement calculation optimization. We can look at again to see if it’s feasible.

---

<div class="post-metadata">

**Author:** ![dillonu](https://avatars.discourse-cdn.com/v4/letter/d/278dde/32.png) [@dillonu](https://forum.inductiveautomation.com/u/dillonu)\
**Post date:** [May 28, 2020, 6:08pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/8 "2020-05-28T18:08:04Z")

</div>

We had to find a workaround to meet a customer requirement (we needed to show 5 rows and column headers within a 100px space).  
The way we’ve gotten around this is by:

1. Create an xy container, and put the table into it
2. Manually added a style property called `zoom` to the xy container, with a value of 0.5 (zooms out)
3. Then we adjusted the font sizes of the cells and columns.

However, this method has a few downsides:

1. Works fine on Chrome, but Safari has several issues (column headers don’t line up with cells)
2. The sort arrows are much smaller
3. And other issues (mainly occurring when virtualization mode was enabled)

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [September 22, 2020, 12:26pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/9 "2020-09-22T12:26:00Z")

</div>

This feature is a necessity when using embedded views...  
Case in point (see the bottom screenshot of the linked post)  
Long short:  
I wanted to have a "table" of embedded views but flex repeater was way too slow and unperformant, even with 10 rows. Moved to using a virtualised Table with 1 column set to use a viewPath. Much more performant and actually useable now, however the height of each row which should be 81px as per the height of the embedded view is ~805px tall in the table! That's a lot of user scrolling to see 600 rows...

> [@Perspective: Designing a "table" for mobile and PC](http://forum.inductiveautomation.com/t/perspective-designing-a-table-for-mobile-and-pc/38205/24):
>
> Got it. I found this in the user manual… not very obvious, also very strange to implement, see the blank “EmbeddedView” object: [image] The reason there’s an empty “EmbeddedView” key is so that it’s associated with the EmbeddedView column… I have no idea what would happen if I wanted to have multiple columns where each one used an embedded view with the same params (and if so, what if those params needed different values??) and my Embedded View params definitions: [image] I still …

---

<div class="post-metadata">

**Author:** ![franklin91](https://avatars.discourse-cdn.com/v4/letter/f/9e8a1a/32.png) [@franklin91](https://forum.inductiveautomation.com/u/franklin91)\
**Post date:** [January 14, 2021, 11:01am UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/10 "2021-01-14T11:01:50Z")

</div>

Is any development taking place to remove the 30px minHeight constraint? I am running into the same issue. I need to set the row height to less than 30px. I’d like to be able to do that without resorting to workarounds such as the one described by @dillonu.

---

<div class="post-metadata">

**Author:** ![wbaker](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/wbaker/32/85315_2.png) [@wbaker](https://forum.inductiveautomation.com/u/wbaker)\
**Post date:** [March 30, 2021, 9:18pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/11 "2021-03-30T21:18:27Z")

</div>

Hey Paul, this worked for me.

---

<div class="post-metadata">

**Author:** ![jasoncoope](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jasoncoope/32/18674_2.png) [@jasoncoope](https://forum.inductiveautomation.com/u/jasoncoope)\
**Post date:** [May 21, 2021, 4:12pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/12 "2021-05-21T16:12:02Z")

</div>

Am running into the same issue. Need to be able to set row height. Makes on sense for a row to be capped at 30px when the font is set to 8px. too much dead space.

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

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [May 21, 2021, 5:59pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/13 "2021-05-21T17:59:22Z")

</div>

Newer versions of Perspective have `Table.props.rows.height` which allows for setting the height of all rows.

 ![Screen Shot 2021-05-21 at 10.59.00 AM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/3/33a997c37c007dd81d2f6d2932bcfd6878931290.png)

---

<div class="post-metadata">

**Author:** ![jasoncoope](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jasoncoope/32/18674_2.png) [@jasoncoope](https://forum.inductiveautomation.com/u/jasoncoope)\
**Post date:** [May 21, 2021, 6:33pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/14 "2021-05-21T18:33:07Z")

</div>

Cheers. Was obviously putting the property in the wrong place!

---

<div class="post-metadata">

**Author:** ![jasoncoope](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jasoncoope/32/18674_2.png) [@jasoncoope](https://forum.inductiveautomation.com/u/jasoncoope)\
**Post date:** [May 21, 2021, 7:31pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/15 "2021-05-21T19:31:03Z")

</div>

Which version is this in? Can’t get it to work in 8.1.5.

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [May 21, 2021, 7:42pm UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/16 "2021-05-21T19:42:24Z")

</div>

Release version 8.1.6.

---

<div class="post-metadata">

**Author:** ![bao.nguyen](https://avatars.discourse-cdn.com/v4/letter/b/8c91f0/32.png) [@bao.nguyen](https://forum.inductiveautomation.com/u/bao.nguyen)\
**Post date:** [June 22, 2021, 3:07am UTC](https://forum.inductiveautomation.com/t/feature-16567-perspective-table-row-height/33466/17 "2021-06-22T03:07:41Z")

</div>

Thank you very much Paul. This solution works for me.
