Proportional auto-layout - width/height and max/min

I have a table

and sometimes I want the first column more width,because usually this column displays long content such as headings,like this:
image

now auto layout only support a geometric layout(Each item is the same width),because uncertainty of content,I can’t give the first column a fixed width.

I know some solution like this:
Proportional auto-layout, possible? - Ask the community - Figma Community Forum

But I think this should be a built-in feature of the software. Because tables are an essential component of UI design

About maximum and minimum,this is a must idea!

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

Hi there,
I would like to know if there is a way to specify proportions to auto-layout? For example, take a horizontal auto-layout, and specify the left part should take 70% of the width, and keep the remaining 30% for the right part.

Thanks.

12 Likes

To my knowledge, no, and that would be a great feature.

Some exceptions:

  • Equal parts layout (50-50, 25-25-25-25, and so on): using “Fill container”, you can have content grow to use space in equal parts (if you have two elements, they’ll each take half of the container, 3 will take a third, etc)
  • Column layout: without using auto layout, you can use the columns and constraints to have content resize according to columns. But as a “normal frame”, this is limited to one dimension. This was discussed here.

There might be some other ways to achieve this but not that I’m currently aware of.

3 Likes

I just had a similar need an hour ago. I have a hybrid solution: I have a large container with two containers inside and I wanted to make them 30%-70% width. I set one inner container to be ‘fill container’ and had to calculate a fixed width on the other (eg: 30% of the parent width). Figma will do percentages on the existing width. So, I selected the smaller inner container, set to be the width of the parent container (eg: 1000), and then selected the width again and typed ‘30%’ in place of the ‘1000’. Figma will do the math for ya. When you resize the parent, unfortunately, you’ll need to adjust the width of that one container with fixed width, but the other will be elastic.
Although, it would be rad if we could set an actual percentage like in flexbox.

5 Likes

Do they need to be wrapped in a single frame? Otherwise I’d just use two frames that takes up 30% and 70% respectively, wrap them in a frame and have them use fixed size and constrain to scale.

That’s interesting. It works, but you lose auto-layout, or did I miss something?

The 30%, 70% frames can still utilize autolayout.
It’s always easier to create something when you know what it is you’re creating, and since I’m not 100% sure what it is you’re trying to do it might be I who has missed something :smile:

It would be great to have a proportional option in the auto-layouts

1 Like

Thanks for the feedback, @Lachlan_Shaw-Stewart!

We’ve merged your topic with an existing one. Be sure to Vote up top as well so we can continue to gauge interest from the community. :ballot_box: