# Container on top of another container?

**URL:** <https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596>\
**Category:** Maker\
**Tags:** perspective\
**Created:** [December 17, 2020, 5:32am UTC](https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596 "2020-12-17T05:32:45Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![sungkhum](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/sungkhum/32/10636_2.png) [@sungkhum](https://forum.inductiveautomation.com/u/sungkhum)\
**Post date:** [December 17, 2020, 5:32am UTC](https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596/1 "2020-12-17T05:32:45Z")

</div>

I know there must be a way to do this, but I can’t seem to figure it out.  
How can I place a container that has a component (in this case a flex container, but it could be any type) on top of another container that has another component in it (or just on top of a component)? I want to place the white circle (which is a container with a css style) over the top of the SimpleGauge aligning them so it looks nice.

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

---

<div class="post-metadata">

**Author:** ![indenkleefj](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/indenkleefj/32/10961_2.png) [@indenkleefj](https://forum.inductiveautomation.com/u/indenkleefj)\
**Post date:** [December 17, 2020, 9:18am UTC](https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596/2 "2020-12-17T09:18:01Z")

</div>

Hi,

Placing containers or components on top of each other in perspective is only possible when using a coordinate container.  
You can use ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/6/16ca0aa8aa6c9825ea88ec7c5f116c2d91509245.png) to arrange the components.

---

<div class="post-metadata">

**Author:** ![jlandwerlen](https://avatars.discourse-cdn.com/v4/letter/j/bc8723/32.png) [@jlandwerlen](https://forum.inductiveautomation.com/u/jlandwerlen)\
**Post date:** [December 17, 2020, 1:47pm UTC](https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596/4 "2020-12-17T13:47:33Z")

</div>

My personal opinion is stacking components should be avoided. On older platforms, like RSView32, it was sometimes necessary due to lack of functionality. I would find a better way to solve your problem.

---

<div class="post-metadata">

**Author:** ![sungkhum](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/sungkhum/32/10636_2.png) [@sungkhum](https://forum.inductiveautomation.com/u/sungkhum)\
**Post date:** [December 17, 2020, 2:20pm UTC](https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596/5 "2020-12-17T14:20:22Z")

</div>

Thanks for your help. Is there a way to create a new Perspective component where I could then combine the two? It would be nice for it to continue to be responsive.

---

<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:** [December 17, 2020, 8:03pm UTC](https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596/6 "2020-12-17T20:03:10Z")

</div>

> [@sungkhum](#):
>
> It would be nice for it to continue to be responsive.

A coord container is still responsive; it will resize the content inside of it based on its dimensions. You can also add a coord container into your flex container, and then only add those two components into the coord container. I use coord containers sparingly, but they are absolutely necessary imo. I use coord containers for all of my device templates (pumps, motors, valves, etc.) as I'm displaying icons and things that overlay other components. This is essentially what any new component developed in a module would be anyway: components arranged in a coordinate space.

---

<div class="post-metadata">

**Author:** ![sungkhum](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/sungkhum/32/10636_2.png) [@sungkhum](https://forum.inductiveautomation.com/u/sungkhum)\
**Post date:** [December 17, 2020, 11:32pm UTC](https://forum.inductiveautomation.com/t/container-on-top-of-another-container/41596/7 "2020-12-17T23:32:27Z")

</div>

Great idea on putting the coord container inside a flex container. It worked great:

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/4/0/40824f02587ab64da143dccc15aff94732a6d360.png)

Thanks for your help!
