Fr/Percent units for more control over auto layout content

Having percentages or proportional settings for an autolayout frame in components would be a gamechanger.

I make responsive web layouts, and with my hero component I may want the image to fill 1/3 of the width for example. Then whenever I place this hero component inside an artboard (sorry ‘frame’ :wink: ) simulating a page across all the breakpoints I design for, I would be able to have one component, with no detaching, that automatically fills the width and makes the image fill 1/3 of whatever width artboard it sits inside.

Another solution would be enabling the fixed width value of a component to be changed on each instance. So the same hero component example again, I set say the left side 2/3’s to set to fill, the image 1/3 set to fixed on the main component. Then I would be able to manually adjust the fixed width of the image by clicking on the image container and updating the fixed width value in the instance to match my grid without any detaching.

2 Likes

Just a quick bump on this. It would be SO helpful! Like, genuinely beyond helpful.

From page layout, to progress bars, to slider controls—all of it would benefit huge from % width, height, position in auto-layout. Also, it be such a time saver in the CSS panel. Our engineers have commented often that all of our design work in static pixel values creates more legwork for them.

+1, please!

Please add this, it would be game changing for auto layout! Would use this everyday building responsive page layouts and components.