Skip to main content
Cody_Porter
Cody_Porter
New Member
January 22, 2021

LAUNCHED: Min and Max Width for Auto Layout

  • January 22, 2021
  • 95 replies
  • 65554 views

I would like to add a max-width to a text box while using auto layout to keep the word count per line at a reasonable minimum.

Currently, I have the text element set to “Fill Container” which makes the text respond very nicely to the screen size. But because it is set to “Fill Container”, the text spans the entire width of the element which makes the text lines more difficult for users to read quickly.

If a max-width was set, the component should respond until it reaches the max-width, which would help keep the line length down.

I also feel like there are many other circumstances where max and min-width would be extremely helpful

Anyone else having this issue? Or does anyone have a great fix/hack to get around it?

Looking forward to seeing what you have to say.

Cheers,

    95 replies

    Show previous replies
    Alex_Wright
    Alex_Wright
    March 14, 2023

    Yes!! This would be so incredible!

    Kevin_Hannon
    Kevin_Hannon
    March 21, 2023

    I vote a big “YES” for Min/Max values! Please make this a reality ASAP, thank you! ❤️

    Franciny_Morales
    Franciny_Morales
    March 21, 2023

    Set a minimum or maximum height or width for the components. To be able to adjust the component by setting a requirement that it cannot exceed a certain size.

      Matthew_Vella
      Matthew_Vella
      April 7, 2023

      +1 for min/max width please. This will be so helpful for responsive designs and developer handoff

        Florian_Riviere
        Florian_Riviere
        April 20, 2023

        Yes !!! +1 too

        Florian_Riviere
        Florian_Riviere
        April 20, 2023

        And this line break in the auto layout part 🫣

        Brian_Coy2
        April 21, 2023

        Vincent. I made the min width work in a couple different ways using the hidden line. In the case of a button with an icon (and all non-2 action) set the line as its own frame under the frame that contains the text and icon.

        Screenshot 2023-04-21 at 11.45.43 AM

          Regina_Casaleggio
          Regina_Casaleggio
          May 24, 2023

          Figma has made a lot of progress in making the design/dev handoff easier and bring design and/dev closer than ever before. Having min/max width and height would be another step closer.
          My use case at the moment is for min-heights on things like buttons, inputs etc That way I don’t have to rely on line-height and top/bottom padding to get the desired height and still have a button text that can wrap.

          NorItu
          NorItu
          June 30, 2023

          You got what you wanted in the end <3

            djv
            Figmate
            djv
            Community Support
            July 3, 2023
            twitter.com
              Show more replies
              Terms & ConditionsAccessibility statement