There are times when having sections free of constraints is nice… but my design team has become addicted to using auto layout with frames. In many cases when using sections, it would be amazing to perfectly space the inner sections out using auto layout.
I discovered a solution! Follow these steps to apply Auto Layout to Sections:
- Right-click on the Section and click Convert to frame
- Add Auto Layout to the Frame and apply your desired values
- Right-click on the Frame and click Copy properties
- Right-click on the Frame and click Convert to section
- Right-click on the Section and click Paste properties
- Do a happy dance 🕺t2:
You will have to redo the process to modify the Auto Layout values, but it should do as a workaround until Figma intentionally adds this functionality.
Work like a charm! Thank you!
Thank you so much for this
+1 Yes please!
I use sections to organize my components (buttons, colors, cards, inputs etc. …)
I would like to be able to organize all these sections with Auto Layout.
For example, I currently have about 20 sections. Sometimes I need to expand, enlarge, or move individual sections to a different position
I hope I have described my wish clearly 😉
Cheers ^M^
👍 Manually resizing sections is too cumbersome. Considering their purpose is to help organize stuff on the canvas, it is almost surprising that autolayout has not been implemented from the start. We need this.
Hope to see a anouncement at Config
Although this did work for a short period of time, it no longer works as of the writing of this reply. This solution was technically a bug which has been squashed. Too bad. I liked this bug 😦
Why has it become impossible to apply Auto Layout to sections using Copy Properties since the release of UI3? I found it incredibly useful for quick direct mouse accessibility and frame organization within sections. Having this feature taken away is very disheartening. This change significantly impacts productivity. I strongly request the rollback of the Auto Layout property copying feature.
Same here. Really need this feature back
Just adding to the chorus - it suddenly stopped working and now I am sad ☹
This should be a feature (to have auto layout on sections), but if nothing else just revert the change so we can at least copy/paste properties as a workaround.
In order to organise components it would be nice to be able to auto-layout sections.
Grouping, regular autolayout or putting into a frame doesn’t allow to mark as “dev-ready” on individual elements inside those options.
also here to say I need this - really bad that the copy/paste autolayout hack does not work anymore 😣
I don’t want the decent back into unorganized chaos 😦
@hyungjin.kil @Hyo @Dustin_Hansen1
The solution I found was leveraging an unintended functionality, otherwise known as a bug. Although this particular bug was convenient for us, it was likely producing inconvenient symptoms too. Preventing unintended functionality, convenient or otherwise, is good practice in software development, the advantages of which far outweigh the disadvantages.
We’re over half way through 2024, and now Dev Mode is a more intrinsic part of Figma. But, between being able to organize the page with auto layouts and actually properly using Sections for components, the “Ready for Development” flag is nearly useless to us.
As a developer, this is hard to navigate with just one huge top-level frame for everything!
I want the document to be navigable from a semantic perspective via the Dev Mode UI, and also visually throughout the document. Allowing Sections to have auto layouts would give us both of these things.
I’m a little sad to see that the previous bug that let us apply it through a workaround was fixed, and I really hope that I see this feature in a future Figma update. 🙏
+1 Again just to keep this alive! How has this not been implemented still?
+1. Frames just don’t have that same “deliverable” feel. Adding auto-layout to sections feels like a no-brainer.
Figma, please add Auto Layout to Frames. I agree with all of the other Figmaniacs here, its a must have feature.
The trick where you copy properties from a frame with autolayout and apply it to a section no longer works. But sections with autolayout applied from when this was possible still contains autolayout with on canvas editing.
Therefore I wanna ask if anyone in here have a Figma file that includes a section with vertical autolayout applied and can be able to share it?
Just shared on the Figma Community.
I hope this helps anyone looking to use Auto Layout in sections:
https://www.figma.com/community/file/1416721100241055771/auto-layout-section
+1!! I mean come on, how hard could it be to enable an existing feature on sections?
+1, please do enable adaptive sections, Figma
Adding my vote (x1000) – this feature is necessary for sections to truly be useful without slowing down our workflow.
まじでほしい!!運営たのむ!!つけてくれ!!一生ついてく!!
Reply
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.