Auto layouts with 2/3rds 1/3 columns

Hello.

Did anyone figure out how to use auto layout and apply a 1/3 vs. 2/3 layout? Setting both children elements to “fill” creates a 50/50 layout. Don’t wanna use “fix” for that.

This question has been asked last year with no native approach. The way I see it the new Auto Layout options can’t manage this either.

Any hacks out there?

Thank you

2 Likes


do you mean something like this?
I was just playing around yesterday trying out different things and was able to make a frame with AL and then put a group inside of the frame and change the spacing from packed to space between to make the separation

This feels like a problem that could be solved by Figma allowing size definitions as percentages. Ex: I could say that an autolayout frame has a fixed width of 40%, and no matter how wide I make the parent frame, the autolayout frame would continue to occupy 40% of the frame.

I don’t know of a way to do that as it’s not something I’ve needed to do up to now, but I can see the value.

7 Likes

thanks, Joshua. But this wouldn’t end in a responsive 1/3 vs. 2/3 layout IMO. You’ll need to set percentage I guess (which is currently no option?!

How about using good od frames for that in a parent frame?
Drawback is, if won’t scale to the content :face_with_hand_over_mouth:

thx Adam. you point out the major drawback yourself. It’s not scaling to content nor responsive.

Allowing percentages would be such a great addition to Auto Layout!

4 Likes

Could you do with/combine with grids?

Well, I managed to have auto-layouts in frames that were attached to a grid layout 1/3 vs. 2/3. Not sure at this point if I accomplished what I set out to do. In any case, this could be easier… % to Auto layout!

What would work is that you set an element’s width to a percentage and other’s to FIll.
[fill][33%]
[fill][fill][33%]
[10%][fill][20%]
etc.

You can’t set % as width. That just calculates the % of the absolute value currently set and applies it.

i need this! Full priority

1 Like

Sigh, my org needs this…

Yes please, this is really essential

Hi @Stephan3

Having two frames (no auto-layout) with scale constraint, within an anther one, should achieve a 1/3 and 2/3 layout. (well you first have to setup your frame so one take a third of the space and the other the rest but once done it worked just fine)

2 Likes

As a matter of fact, this works, yes.

Thank you :slight_smile:

1 Like

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