Skip to main content
Aalok_Trivedi
January 29, 2021

Fr/Percent units for more control over auto layout content

  • January 29, 2021
  • 214 replies
  • 20235 views

Although I find the new autolayout UI extremely convoluted and overdesigned, the ‘hug/fill parent’ feature is great. However, It would be immensely helpful to have more control over how the elements fill the parent.

Currently, the only option is for the elements to fill the remaining space, but oftentimes, I need certain elements to take up a certain proportion.

Example: I need element-1 to take up 2fr (~66%) and the rest to take up 1fr (~33%). It would be a game-changer if we could use ‘fr’ units.

Framer does this beautifully and it’s vital for efficient, adaptive layout workflows:

    214 replies

    Shane_Carlson
    December 23, 2022

    Plz make it so!!

    Anton85
    January 16, 2023

    +1, go forward

    Anastasia67
    New Member
    February 28, 2023

    Please make this happen!

    Jared_Wolf2
    March 2, 2023

    this would be awesome, along with some Grids

    Weirdo
    Active Member
    March 2, 2023

    +1, must have feature.

    Anastasia67
    New Member
    March 23, 2023

    Please make this happen!! If we are building designs that should mimick real life responsiveness this should be critical feature

    Guillaume_BRACHON
    New Participant
    March 29, 2023

    Totally need this. Please make it happen 🙂

    Damir
    April 7, 2023

    +1 million. Please evolve beyond the design stone age, Figma!

    Janie_Ray
    April 7, 2023

    +1 million also—this is crucial to responsive design!

    Gavin_Cammell
    May 1, 2023

    It would be great to be able to layout elements by column-widths or percentages for column based designs. If I actually had the ability to divide components and elements into columns the layout-grid wouldn’t really be a necessity.

    The time it would save me would be immense.

    Even having percentages would be a really good step.

    https://forum.figma.com/t/auto-layout-with-different-column-width/22662/3