# View automatically grow or shrink based on its content

**URL:** <https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [May 9, 2025, 1:35pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105 "2025-05-09T13:35:32Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![patrick.maltais](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/patrick.maltais/32/3958_2.png) [@patrick.maltais](https://forum.inductiveautomation.com/u/patrick.maltais)\
**Post date:** [May 9, 2025, 1:35pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105/1 "2025-05-09T13:35:33Z")

</div>

I would like to make a view adjust it's height automatically based on the content. I configured a view as a flex column container. Suppose I place two labels on top of each other. I would like the view to adjust its height to display only these two labels. If I set the Display property of one of the labels to false I would expect the view to shrink to the size of the remaining label. If I set back the Display property to true, I woud expect te view to grow in order to show the two labels. Is it possible?

---

<div class="post-metadata">

**Author:** ![dkhayes117](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dkhayes117/32/68344_2.png) [@dkhayes117](https://forum.inductiveautomation.com/u/dkhayes117)\
**Post date:** [May 9, 2025, 1:40pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105/2 "2025-05-09T13:40:14Z")

</div>

I think you can set the view's height to `auto`. Note that if you resize the view in the designer manually, it will overwrite the height back to a number value

[Useful CSS Stuff - Ignition - Inductive Automation Forum](https://forum.inductiveautomation.com/t/useful-css-stuff/95414/11)

---

<div class="post-metadata">

**Author:** ![patrick.maltais](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/patrick.maltais/32/3958_2.png) [@patrick.maltais](https://forum.inductiveautomation.com/u/patrick.maltais)\
**Post date:** [May 9, 2025, 1:45pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105/3 "2025-05-09T13:45:46Z")

</div>

Setting the height to auto raises an error: defaultSize.height: string found, integer expected

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

---

<div class="post-metadata">

**Author:** ![dkhayes117](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dkhayes117/32/68344_2.png) [@dkhayes117](https://forum.inductiveautomation.com/u/dkhayes117)\
**Post date:** [May 9, 2025, 1:46pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105/4 "2025-05-09T13:46:11Z")

</div>

I know, but it still works, at least for popups.

---

<div class="post-metadata">

**Author:** ![patrick.maltais](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/patrick.maltais/32/3958_2.png) [@patrick.maltais](https://forum.inductiveautomation.com/u/patrick.maltais)\
**Post date:** [May 9, 2025, 1:49pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105/5 "2025-05-09T13:49:47Z")

</div>

Indeed it works! Thanks for the tip!

---

<div class="post-metadata">

**Author:** ![patrick.maltais](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/patrick.maltais/32/3958_2.png) [@patrick.maltais](https://forum.inductiveautomation.com/u/patrick.maltais)\
**Post date:** [May 9, 2025, 1:51pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105/6 "2025-05-09T13:51:41Z")

</div>

It also works if the view is used as a template in an embedded view, which was the purpose of the question at first!

---

<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:** [May 9, 2025, 10:25pm UTC](https://forum.inductiveautomation.com/t/view-automatically-grow-or-shrink-based-on-its-content/106105/7 "2025-05-09T22:25:02Z")

</div>

When it's embedded in a column flex you can just define the basis as `auto` to set the height based on its content. This works for any component within a flex