Why does the dashboard layout complete rearrange when adding an additional element?

Why does the dashboard layout, within a given tab, completely rearrange when adding an additional element to said tab? This is quite frustrating actually. I spent considerable time getting items placed as desired, and then added an additional item in a flow, a ui text item. The result was everything was completely moved around in the associated dashboard the tab, some type of automatic formatting. It completely ruined the work previous.

Before...

After...

Is there by any chance a way to stop this rearrangement behavior?

What versions of node-red and node-red-dashboard are you using? Are they the latest?

I believe so, all my node-red instances are quite new. Here is what I see for the versions:

Node Red 1.0.6
Node Red Dashboard 2.22.1

It's a bit fiddly creating larger groups with lots of elements, I noticed that too, but I generally avoid those setups.

I have a suggestion. Looking at your screenshot, you try to arrange your data in a tabular manner. Lots of repeating widgets.

I think you would be better off using a ui-template node and create a proper table, or even better, using this widget here: https://flows.nodered.org/node/node-red-node-ui-table

1 Like

True, this is the draft, just getting it working, and it does work fine, it is only when I add a new item to the tab that the thing goes wacko.

When you add a new item, try to ensure it gets added to the bottom of the list in the dashboard sidebar. If you copy/paste an existing widget it'll probably get added next to the original instead.
Also the layout engine seems to work best if widgets are the same width or exact multiples thereof.