Skip to main content

I have the attached design. I’d like to add auto-layout so that I can switch off and add more layers to it as needed. I’d like it to be responsive just in case the line of text becomes greater than 2 lines. I don’t know what I’m doing wrong but nothing seems to work. How do I go about this?



To achieve this you need to nest Auto Layouts.



  1. For this setup you start by creating the three text layers and group them in an Auto Layout (vertical).

  2. Then create the button and the number and group them in an Auto Layout (vertical) also.

  3. Create the thumbnail layer

  4. Select the thumbnail layer, the text Auto Layout and the button Auto Layout and create a new Auto Layout (horizontal).


To get the responsive behaviour you need to set the text Auto Layout to fill container, also set the text layers inside to fill container.



The file: https://www.figma.com/file/IRmUlIMmLRoSvrWX0dl22S/Untitled?type=design&node-id=1%3A5&mode=design&t=SBGZgH1RR3744yUm-1


Reply