# Perspective expand "card" if components displayed

**URL:** <https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781>\
**Category:** Ignition\
**Tags:** ignition80, perspective\
**Created:** [August 17, 2020, 12:05am UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781 "2020-08-17T00:05:54Z")\
**Posts on this page:** 7\
**Page:** 1

<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:** [August 17, 2020, 12:05am UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781/1 "2020-08-17T00:05:54Z")

</div>

v8.0.15

I’m playing with Perspective and I have a “card” based on a row flex container with some components in there that may or may not be displayed. For example below, the flow fault can show and hide (using `display` property), but at the moment the card doesn’t shrink up if it’s not displayed. How can I do this?

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/e/1eb55d17c12c9a144aa90dca30d31986a5475238.png)

What it does now if fault not displayed:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/9/b9f1fea8323be4ca34a94d95974caff4ae607f77.png)

What I want it to do if not displayed:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/6/760e9f41be3aad209769a912cc6bb097d3a2cf22.png)

---

<div class="post-metadata">

**Author:** ![michael2](https://avatars.discourse-cdn.com/v4/letter/m/3e96dc/32.png) [@michael2](https://forum.inductiveautomation.com/u/michael2)\
**Post date:** [August 17, 2020, 12:30am UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781/2 "2020-08-17T00:30:47Z")

</div>

You could create a param that counts the number of items that aren’t displayed, and adjust your height based on that. That requires your components being a fixed height though. An auto size feature would be handy.

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [August 17, 2020, 2:37pm UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781/3 "2020-08-17T14:37:37Z")

</div>

What container is the ‘flow card’ itself in? If it’s a flex container, what it’s basis set to?

---

<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:** [August 17, 2020, 5:34pm UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781/4 "2020-08-17T17:34:25Z")

</div>

Set the basis for the “card” to be “auto”.

---

<div class="post-metadata">

**Author:** ![michael2](https://avatars.discourse-cdn.com/v4/letter/m/3e96dc/32.png) [@michael2](https://forum.inductiveautomation.com/u/michael2)\
**Post date:** [August 18, 2020, 12:34am UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781/5 "2020-08-18T00:34:37Z")

</div>

Could this also be an option for components in column containers? It’d be nice to just use auto rather than set up expressions to change the size.

---

<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:** [August 18, 2020, 2:05am UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781/6 "2020-08-18T02:05:32Z")

</div>

You should use a Flex container into a Column Container, and then let the Flex Container manage the size from that point.

---

<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:** [August 18, 2020, 2:22am UTC](https://forum.inductiveautomation.com/t/perspective-expand-card-if-components-displayed/37781/7 "2020-08-18T02:22:31Z")

</div>

Thanks, I set to auto basis which now expands and contracts the card, but now i get scrollbars when the alarm is shown:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/0/704bcb7cc6df4647fa65ad308425eeb0c0cfb294.png)

Edit: Originally the fault label had a basis of 27px. When I changed that to `auto`, the scrollbars went away. Now I’m curious why?
