# \[Group Collapsed options select\] \[Position Fix\]

**URL:** <https://discourse.nodered.org/t/group-collapsed-options-select-position-fix/76663>\
**Category:** Dashboard\
**Created:** [17 March 2023 11:11 UTC](https://discourse.nodered.org/t/group-collapsed-options-select-position-fix/76663 "2023-03-17T11:11:59Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![JulesRosette](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/julesrosette/32/51637_2.png) [@JulesRosette](https://discourse.nodered.org/u/JulesRosette)\
**Post date:** [17 March 2023 11:11 UTC](https://discourse.nodered.org/t/group-collapsed-options-select-position-fix/76663/1 "2023-03-17T11:11:59Z")

</div>

Hi developers,  
I have create a dashboard with several groups where options «_Allow group to be collapsed »_ and _« Dispaly group name »_ are enabled.

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

Each time i use the arrow group for collapsed,each other group are rearrange regarding the position.  
From my side,i would like to get them keep the same position.

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

I tried to solve it by using the following code:

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/4/744857ad6a5baefb6bac688dc4756f89382fd9e4.png)

But no issue because by did that i loose the arrow and name group.

Where is my fault please ?  
before

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/e/1/e15036a8d2495173985bdcdf4830438a0dd5d501.png)  
After open group1:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/c/2/c26e882ec22f92862093b71d43656126e5e35fe0.png)

Would like to get group3 in the same position

---

<div class="post-metadata">

**Author:** ![hotNipi](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/hotnipi/32/383_2.png) [@hotNipi](https://discourse.nodered.org/u/hotNipi)\
**Post date:** [17 March 2023 11:36 UTC](https://discourse.nodered.org/t/group-collapsed-options-select-position-fix/76663/2 "2023-03-17T11:36:51Z")

</div>

Dashboard layout is tricky and doesn't let you do such manipulations in easy way. The reason is that even beginner level user will get layout done without any coding. It is powerful enough to rearange groups for different screen sizes with again - no special treatments or coding skills needed. Great stuff.

But that is only one type of layout and zero options.  
To make it behave somehow different it takes to overwrite all that behavior and write your own layout rules. It is possible but takes at least intermediate CSS skills.

See this thread, you may find some ideas..

> [@A bit different dashboard layout](https://discourse.nodered.org/t/a-bit-different-dashboard-layout/71869):
>
> Sometimes the default layout just doesn't do the trick. And we have been agreed with it as there is not much to do with it. Well, I was forced a bit to think again ... There isn't too much but it may open some possibilities to play with it. [{"id":"4e7e0d90ee7aa1ad","type":"ui\_template","z":"bf0d83d32eec75c2","group":"674712f8d915bcc0","name":"A bit different layout","order":7,"width":0,"height":0,"format":"\<style id='different-layout'\>\n .masonry-container {\n position: relative;\n…

---

<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:** [16 April 2023 11:37 UTC](https://discourse.nodered.org/t/group-collapsed-options-select-position-fix/76663/3 "2023-04-16T11:37:48Z")

</div>

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