Alignment of groups in pages

[Paul-Reed]

I have a page laid out as 'Fixed', and 2 groups;
The first group is sized 6 x 6 and which contains gauges.
The second group is 3 x 6 and does not contain any widgets.
Together, they look like this;

However, whenever I add something to the second group, the group's height increases, and is no longer bottom aligned with the first group.
By example, I've added a 3 x 3 text box and some random text.

In my example above, the group was 3 x 6, and the widget was only 3 x 3, so why was it necessary to auto increase the size of the group, surely 3 x 3 would fit with room to spare??

Forum discussion - https://discourse.nodered.org/t/alignment-of-groups-in-pages-dashboard-2/86210?u=paul-reed

[joepavitt]

okay, spotted one issue in the Grid layout, which I've now fixed (this previously wasn't rendering the full height for the 3x6 group), which i know isn't the issue reported here, but it's closely related.

Still trying to find the equivalent problem in Fixed as reported in this particular issue

In the situation where it really does not have the space to render all the text, I am still choosing to expand to content at the moment:

[Paul-Reed]

I've created 2 identical groups, both 3x6, and added an inject node containing some text which feed one group, whilst the other group has no text.
My CSS nodes have been disabled.

[{"id":"9d6edffda7c0d564","type":"ui-text","z":"1326aadbacf36704","group":"4c637ca6c57dac54","order":0,"width":"3","height":"3","name":"","label":"text","format":"{{msg.payload}}","layout":"row-spread","style":false,"font":"","fontSize":16,"color":"#717171","className":"","x":350,"y":360,"wires":[]},{"id":"d6b07fc3709512ec","type":"inject","z":"1326aadbacf36704","name":"","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco","payloadType":"str","x":130,"y":360,"wires":[["9d6edffda7c0d564"]]},{"id":"a63c3b6699a82214","type":"ui-text","z":"1326aadbacf36704","group":"2907cc0695e59ca5","order":0,"width":0,"height":0,"name":"","label":"text","format":"{{msg.payload}}","layout":"row-spread","style":false,"font":"","fontSize":16,"color":"#717171","className":"","x":350,"y":420,"wires":[]},{"id":"4c637ca6c57dac54","type":"ui-group","name":"Misc","page":"d6557c66b0d2c002","width":"3","height":"6","order":-1,"showTitle":false,"className":"","visible":"true","disabled":"false"},{"id":"2907cc0695e59ca5","type":"ui-group","name":"Test","page":"d6557c66b0d2c002","width":"3","height":"6","order":-1,"showTitle":false,"className":"","visible":"true","disabled":"false"},{"id":"d6557c66b0d2c002","type":"ui-page","name":"Energy","ui":"ae3d4aeb3f977a90","path":"/energy","icon":"home","layout":"flex","theme":"a965ccfef139317a","order":-1,"className":"","visible":"true","disabled":"false"},{"id":"ae3d4aeb3f977a90","type":"ui-base","name":"Dashboard","path":"/dashboard","includeClientData":true,"acceptsClientConfig":["ui-notification","ui-control"],"showPathInSidebar":false,"navigationStyle":"temporary"},{"id":"a965ccfef139317a","type":"ui-theme","name":"Default","colors":{"surface":"#ffffff","primary":"#0094ce","bgPage":"#eeeeee","groupBg":"#ffffff","groupOutline":"#cccccc"},"sizes":{"pagePadding":"12px","groupGap":"12px","groupBorderRadius":"4px","widgetGap":"12px"}}]

[joepavitt]

Thanks @Paul-Reed with code as-is, I expect that behaviour, fix is in the attached PR which I need a review on before I can merge.

Should hopefully be resolved in a release tomorrow, early next week at the latest

[Paul-Reed]

Still trying to find the equivalent problem in Fixed as reported in this particular issue

Ah OK, I thought you couldn't reproduce.
There's no rush, I'm using hotnipi's css hack at the moment.