# Looking for guidance on creating a fixed Perspective dashboard that scales across different screen sizes without scrollbars in Embedded Views, while still allowing components to be easily rearranged when the layout changes

**URL:** <https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [September 30, 2026, 1:29pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269 "2026-09-30T13:29:08Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [September 30, 2026, 1:29pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/1 "2026-09-30T13:29:08Z")

</div>

Hi everyone,

I have a question regarding the best approach for designing a Perspective view for different screen sizes.

Currently, I'm using a Coordinate Container with multiple Embedded Views, which gives me the flexibility to reposition the components whenever the layout needs to change.

The difficulty is making the same layout work across desktop, laptop, and tablet. On smaller screens, scrollbars appear inside some of the Embedded Views.

Ideally, I want the components to resize and reposition responsively based on the available screen size, while preserving the overall arrangement and without stacking or creating internal scrollbars.

What would be the ideal container/view structure for this? Is there a recommended way to make the Embedded Views and their contents respond to screen size while still keeping the flexibility of a Coordinate Container?

Thanks!

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [September 30, 2026, 2:26pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/2 "2026-09-30T14:26:08Z")

</div>

It is difficult to make coordinate containers responsive with native Ignition features.

For the simplest route to success, consider BIJC's [Pan and Zoom](https://forum.inductiveautomation.com/t/pan-zoom-container/75093) 3rd party component.

For the most robust responsiveness, abandon coordinate containers and learn to use flex containers.

---

<div class="post-metadata">

**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\
**Post date:** [September 30, 2026, 2:32pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/3 "2026-09-30T14:32:26Z")

</div>

If you must use Coordinate Containers, make sure you set `mode: percent` and not fixed. But really you should use Flex layouts.

---

<div class="post-metadata">

**Author:** ![msteele](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/msteele/32/77889_2.png) [@msteele](https://forum.inductiveautomation.com/u/msteele)\
**Post date:** [September 30, 2026, 3:22pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/4 "2026-09-30T15:22:17Z")

</div>

Flex containers and `basis: auto` are your friend.  
What's the flexibility of the coordinate container you speak of?

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [September 30, 2026, 3:57pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/5 "2026-09-30T15:57:36Z")

</div>

> [@pturmel](#):
>
> It is difficult to make coordinate containers responsive with native Ignition features.
> 
> For the simplest route to success, consider BIJC's [Pan and Zoom](https://forum.inductiveautomation.com/t/pan-zoom-container/75093) 3rd party component.
> 
> For the most robust responsiveness, abandon coordinate containers and learn to use flex containers.

Thank you , I’ll look into the Pan and Zoom component as well. I’ll also test whether the process layout can be achieved using Flex containers while still preserving the required positioning.

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [September 30, 2026, 3:58pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/6 "2026-09-30T15:58:42Z")

</div>

> [@Ryan\_Deardorff](#):
>
> If you must use Coordinate Containers, make sure you set `mode: percent` and not fixed. But really you should use Flex layouts

The Coordinate Container is currently placed inside a Flex Container. I’ll try changing the Coordinate Container to percent mode and see how it behaves.

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [September 30, 2026, 4:01pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/7 "2026-09-30T16:01:14Z")

</div>

> [@msteele](#):
>
> Flex containers and `basis: auto` are your friend.  
> What's the flexibility of the coordinate container you speak of?

The Coordinate Container is already within a Flex structure. The Main Shell, sidebar, Main Content and Dashboard Content are all using Flex Containers, with the Coordinate Container inside the Dashboard Content.

The individual process blocks are separate Embedded Views placed within the Coordinate Container. The reason for this is to keep the process layout dynamic, so the blocks can be easily repositioned based on changes to the factory process flow while maintaining the required visual representation.

---

<div class="post-metadata">

**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\
**Post date:** [September 30, 2026, 4:03pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/8 "2026-09-30T16:03:01Z")

</div>

I have Coordinate Containers inside root Flex Containers that work well. Just make sure `grow` and `shrink` are both 1.

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [September 30, 2026, 4:06pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/9 "2026-09-30T16:06:52Z")

</div>

yes i have the grow, set to 1 and the basis to 0px

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [September 30, 2026, 4:13pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/10 "2026-09-30T16:13:14Z")

</div>

The current perpective dashbaord when viewed on a smart phone the components come with a scroll bar that i am trying to avoid....

 ![WhatsApp Image 2026-09-29 at 12.54.34](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/8/f8f1ff278164b9cd20ce1a218d9dc7d00d0cc3ff.jpeg)

---

<div class="post-metadata">

**Author:** ![Ryan\_Deardorff](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan_deardorff/32/63815_2.png) [@Ryan\_Deardorff](https://forum.inductiveautomation.com/u/Ryan_Deardorff)\
**Post date:** [September 30, 2026, 4:23pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/11 "2026-09-30T16:23:41Z")

</div>

There are probably sub-components that have minimum sizes that make it impossible for it all to fit, so you would need to make them capable of being smaller, and make sure their basis is flexible. Embedded views should not have "useDefaultViewWidth/Height" checked and their basis should be grow/shrink 1.

---

<div class="post-metadata">

**Author:** ![Nol](https://avatars.discourse-cdn.com/v4/letter/n/8e8cbc/32.png) [@Nol](https://forum.inductiveautomation.com/u/Nol)\
**Post date:** [September 30, 2026, 10:12pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/12 "2026-09-30T22:12:46Z")

</div>

You could try embedding your coordinate container as an embedded view then under style add 'zoom' : 75% and it'll shrink it. Could play around with a binding on zoom to handle the screen scaling though I'd probably suggest to do it in an advanced style sheet so you can set a minimum as well. If I remember right dropdowns dont work well with zoom but maybe it'll be a start to give you some ideas.

```python
/* apply style class "viewZoom" to the embedded view or its root container */
.psc-viewZoom { zoom: 1; }

@media (min-width: 3000px) { .psc-viewZoom { zoom: 2; } } /* 4K */
@media (max-width: 600px) { .psc-viewZoom { zoom: 0.5; } } /* phone */

```

---

<div class="post-metadata">

**Author:** ![lane.duncan](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lane.duncan/32/83700_2.png) [@lane.duncan](https://forum.inductiveautomation.com/u/lane.duncan)\
**Post date:** [October 1, 2026, 5:57am UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/13 "2026-10-01T05:57:54Z")

</div>

Another alternative is to use a breakpoint container, using your original coordinate container on the large breakpoint, and smaller, more flexible objects below the breakpoint.

This method permanently adds a lot of work (double the screens to maintain ), so I avoid it, but sometimes the extra work is necessary to meet the specifications.

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [October 1, 2026, 6:51am UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/14 "2026-10-01T06:51:52Z")

</div>

That sounds like a good approach for what I’m trying to achieve. I need to preserve the same process layout across desktop, laptop, tablet and phone rather than rearranging the process blocks for smaller screens. I’ll try embedding the coordinate container as a view and scaling the whole view using `zoom`, then test how the embedded components behave at different screen sizes. Thank you 🙂

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [October 1, 2026, 6:52am UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/15 "2026-10-01T06:52:38Z")

</div>

> [@lane.duncan](#):
>
> Another alternative is to use a breakpoint container, using your original coordinate container on the large breakpoint, and smaller, more flexible objects below the breakpoint.
> 
> This method permanently adds a lot of work (double the screens to maintain ), so I avoid it, but sometimes the extra work is necessary to meet the specifications.

I was considering this approach as well. My concern is the additional maintenance, especially since the process layout can change over time and the same layout needs to be reflected across different screen sizes. I’ll keep the breakpoint approach as an option if scaling the same coordinate layout doesn’t work reliably.

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [October 1, 2026, 6:53am UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/16 "2026-10-01T06:53:30Z")

</div>

That could be part of the issue I’m seeing, as some of the embedded views start showing scrollbars when the available space gets smaller. I’ll check the default view width/height settings and make sure the embedded views are allowed to grow and shrink rather than keeping a minimum size. I’ll test this together with the scaling approach.

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [October 1, 2026, 7:07am UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/17 "2026-10-01T07:07:38Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![a23sursa](https://avatars.discourse-cdn.com/v4/letter/a/b38774/32.png) [@a23sursa](https://forum.inductiveautomation.com/u/a23sursa)\
**Post date:** [October 1, 2026, 7:07am UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/18 "2026-10-01T07:07:50Z")

</div>

For some more context, this is the exact layout I need to preserve across all screen sizes.

The dashboard uses a Coordinate Container, with the individual process blocks as Embedded Views. Their positions represent the actual process/factory flow, so I don't want the blocks to stack or rearrange when moving between desktop, laptop, tablet and phone.

The goal is for this exact layout to proportionally scale up or down to fit the available screen while maintaining the same relative positions of all the process blocks.

Ideally, I would like to maintain only one layout, since the process flow can change and the Embedded Views may need to be repositioned in the future.

Would embedding the complete Coordinate Container as a single Embedded View and scaling that outer view using `zoom`/media queries be a suitable approach for this?

---

<div class="post-metadata">

**Author:** ![lane.duncan](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/lane.duncan/32/83700_2.png) [@lane.duncan](https://forum.inductiveautomation.com/u/lane.duncan)\
**Post date:** [October 3, 2026, 5:07am UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/19 "2026-10-03T05:07:15Z")

</div>

That is way too much text and information to reasonably expect to fit on a single phone screen. Even if you did get it all to fit the text would be too small to be useful.

Pick a minimum resolution width specification, make it work to that specification, and it will automatically scale up from there. Be sure all users understand the minimum screen width specification, otherwise the complaints will be endless.

Personally I would break this up into two projects, one for desktop and a high resolution tablet, the other for mobile.

Otherwise you will be fighting this issue until the end of time.

---

<div class="post-metadata">

**Author:** ![Chris\_Bingham](https://avatars.discourse-cdn.com/v4/letter/c/e5b9ba/32.png) [@Chris\_Bingham](https://forum.inductiveautomation.com/u/Chris_Bingham)\
**Post date:** [October 4, 2026, 2:12pm UTC](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269/20 "2026-10-04T14:12:17Z")

</div>

I strongly recommend this post:

> [@pturmel](#):
>
> For the simplest route to success, consider BIJC's [Pan and Zoom](https://forum.inductiveautomation.com/t/pan-zoom-container/75093) 3rd party component.

It was built to solve this exact problem, and it does it well. You really should start here if you’re able (to install 3rd party modules).

[Next page](https://forum.inductiveautomation.com/t/looking-for-guidance-on-creating-a-fixed-perspective-dashboard-that-scales-across-different-screen-sizes-without-scrollbars-in-embedded-views-while-still-allowing-components-to-be-easily-rearranged-when-the-layout-changes/117269.md?page=2)
