# DB1 to DB2: Widget/group sizing and layout issues

**URL:** <https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542>\
**Category:** Dashboard\
**Tags:** node-red-dashboard, dashboard-2\
**Created:** [6 August 2025 15:46 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542 "2025-08-06T15:46:47Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![rakgupta](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/rakgupta/32/42535_2.png) [@rakgupta](https://discourse.nodered.org/u/rakgupta)\
**Post date:** [6 August 2025 15:46 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/1 "2025-08-06T15:46:47Z")

</div>

Hello:

I am migrating my DB1 dashboard to DB2 and having a hard time adjusting the layout. For example: a widget that was sized as 8X7 in DB1 does not match the width/height of an 8X7 widget in DB2 and I have to play around with the dimensions on each widget.

I searched this board and I found a couple of posts that seemed relevant but not what I was looking for ([DB2 Widget Autosizing](https://discourse.nodered.org/t/db2-since-1-24-1-onwards-the-size-of-widgets-is-getting-changed/98103)).

My DB1 configuration was as follows:

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

My DB2 theme configuration is:

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

I don’t see a way to define the widget size in DB2. Does anyone know what the 1X1 widget size (in px) is in DB2 or if there is a way to define that like in DB1?

Thanks for your help.

---

<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:** [6 August 2025 16:06 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/2 "2025-08-06T16:06:18Z")

</div>

Have you configured the page as format Grid?

---

<div class="post-metadata">

**Author:** ![rakgupta](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/rakgupta/32/42535_2.png) [@rakgupta](https://discourse.nodered.org/u/rakgupta)\
**Post date:** [6 August 2025 16:48 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/3 "2025-08-06T16:48:45Z")

</div>

Grid format - sorry I forgot to include that.

**EDIT:** Actually, most of the pages are “fixed” as I used the Flowfuse migration service (just new ones defaulted to grid)

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [6 August 2025 16:52 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/4 "2025-08-06T16:52:12Z")

</div>

In Dashboard 2.0, to account for responsive layouts, we have a different default layout - “Grid”. This splits the screen into (by default) 12 columns, so something that is “6” units wide, is in fact 6/12 columns (50%) wide.

To have fixed widths like in Dashboard 1.0, you can change the Page’s layout to “Fixed”.

---

<div class="post-metadata">

**Author:** ![rakgupta](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/rakgupta/32/42535_2.png) [@rakgupta](https://discourse.nodered.org/u/rakgupta)\
**Post date:** [6 August 2025 16:57 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/5 "2025-08-06T16:57:55Z")

</div>

> [@joepavitt](#):
>
> To have fixed widths like in Dashboard 1.0, you can change the Page’s layout to “Fixed”.

@joepavitt - I just checked and since I used the “migration” service from Flowfuse to update the flows (at least that’s my hypothesis), the updated pages were “fixed” and only the new ones (that I created for testing) were created as “grid”

---

<div class="post-metadata">

**Author:** ![joepavitt](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/joepavitt/32/59722_2.png) [@joepavitt](https://discourse.nodered.org/u/joepavitt)\
**Post date:** [6 August 2025 17:31 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/6 "2025-08-06T17:31:19Z")

</div>

You can control the height (i.e. 1 x row) in the theme: [Config: UI Theme ui-theme | Node-RED Dashboard 2.0](https://dashboard.flowfuse.com/nodes/config/ui-theme#row-height)

---

<div class="post-metadata">

**Author:** ![rakgupta](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/rakgupta/32/42535_2.png) [@rakgupta](https://discourse.nodered.org/u/rakgupta)\
**Post date:** [6 August 2025 17:40 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/7 "2025-08-06T17:40:25Z")

</div>

Thanks - I had done that (“comfortable”). I think my issue was that I was doing the layout testing on page config as “grid” and then applying the same to a page that was configured as “fixed”. There are still some oddities, but it looks like it’s mostly working.

Thanks for your help.

---

<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:** [5 September 2025 17:40 UTC](https://discourse.nodered.org/t/db1-to-db2-widget-group-sizing-and-layout-issues/98542/8 "2025-09-05T17:40:52Z")

</div>

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