# Dashboard 2 single page?

**URL:** <https://discourse.nodered.org/t/dashboard-2-single-page/100388>\
**Category:** Dashboard\
**Tags:** dashboard-2\
**Created:** [17 February 2026 10:53 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388 "2026-02-17T10:53:30Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![Aaqu](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/aaqu/32/101407_2.png) [@Aaqu](https://discourse.nodered.org/u/Aaqu)\
**Post date:** [17 February 2026 10:53 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/1 "2026-02-17T10:53:30Z")

</div>

How to make a single page template that fits the page to browser in dashboard 2?

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [17 February 2026 11:37 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/2 "2026-02-17T11:37:27Z")

</div>

Hi, you really haven't given people much to go on in order to help you I'm afraid. You will need to expand on what you want to achieve.

---

<div class="post-metadata">

**Author:** ![Aaqu](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/aaqu/32/101407_2.png) [@Aaqu](https://discourse.nodered.org/u/Aaqu)\
**Post date:** [19 February 2026 12:20 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/3 "2026-02-19T12:20:24Z")

</div>

I use a template in my apps, so maybe my solution is wrong. Can it be automatically adjusted to the selected screen?

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/5/c5c5c1eed731aa200008ac720ed338d7b1a6b3f3.png)

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [19 February 2026 12:42 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/4 "2026-02-19T12:42:04Z")

</div>

You can set how many columns of widgets will be fitted across different screen sizes for a page using the settings in the Responsive Layouts section of the ui-page settings

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/6/b69d8f60b7505c143412f5b043faab476a38ef5a.png)

Then if you make the group width be the same as the number of columns and make the template width be the full group width then it should fill the screen sideways.

The row height is configurable to some extent in the Theme settings, so you can determine how many rows you need to approximately fill the screen vertically.

---

<div class="post-metadata">

**Author:** ![Aaqu](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/aaqu/32/101407_2.png) [@Aaqu](https://discourse.nodered.org/u/Aaqu)\
**Post date:** [19 February 2026 13:31 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/5 "2026-02-19T13:31:18Z")

</div>

better, although I still don't understand the transition with the height, I have to count the height on the backend side (from row height)?  
screen

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/b/3ba883d5359fc97e1bdad2f692beef4ecb6b5956.png)

page

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/0/4/0489a59afbcfc7affc821746ec37104ae324142e.png)

group

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/3/b37f4bc8ee63a6d85da0b2d6f1dfc853cf6fdad1.png)

theme

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/3/6/36c960798e10ad3025e47fb577cef635c2d77cd8.png)

---

<div class="post-metadata">

**Author:** ![Colin](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/colin/32/17040_2.png) [@Colin](https://discourse.nodered.org/u/Colin)\
**Post date:** [20 February 2026 08:38 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/6 "2026-02-20T08:38:51Z")

</div>

You have set the row height to 32px so if a widget is of height, for example, 4 then it should take 128 px.

---

<div class="post-metadata">

**Author:** ![Aaqu](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/aaqu/32/101407_2.png) [@Aaqu](https://discourse.nodered.org/u/Aaqu)\
**Post date:** [20 February 2026 11:08 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/7 "2026-02-20T11:08:51Z")

</div>

Finally found the solution and a topic worth closing out. I built the dashboard template starting from a single full-bleed container that locks itself to its parent - no scrollbars, no overflow, exact bounds. Inside it, everything flows top-down in a column with consistent padding on all sides. Box-sizing is set so padding never breaks the layout. That one wrapper handles all spatial constraints for everything inside it.

By default, it should be possible to create elements that will take up the entire screen.

---

<div class="post-metadata">

**Author:** ![jbudd](https://avatars.discourse-cdn.com/v4/letter/j/5f8ce5/32.png) [@jbudd](https://discourse.nodered.org/u/jbudd)\
**Post date:** [20 February 2026 11:22 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/8 "2026-02-20T11:22:59Z")

</div>

I hope you will share your solution!

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [22 March 2026 11:23 UTC](https://discourse.nodered.org/t/dashboard-2-single-page/100388/9 "2026-03-22T11:23:28Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.