Skip to main content

I wonder if I have hit a limitation in Figma. I have tried to make the columns behave akin to the CSS-based grid system as championed by e.g. Bootstrap. But I failed in achieving what I want. Basically, what I want is this basic responsiveness, but column based. I assume that would make it far easier for the developers to know how to implement the design, since they use a grid system in CSS. But as shown in this video, none of my experiments work.


I wonder if it boils down to this: If a child element has:



  • horisontal constraint set to “Scale” and

  • vertical constraint set to “Hug contents”


Then the parent element cannot have:



  • vertical constraint set to “Hug contents”


Is this is a known limitation in Figma?


If yes, are there well-supported plugins that can work around this problem, or is it outside Figma’s scope to offer this type of alignment with CSS-based grid systems?

Due to low activity here I have cross posted to Stack Exchange.

As discussed here: as far as I know full grid responsiveness is impossible in Figma. You have to either choose a column-based, traditional frames method that will only work horizontally (your second example), or an autolayout-based method that will only allow equal childs or one variable child and otherwise fixed childs (your third and first examples).


Several threads, like this one have requested an evolution of Autolayout to support CSS grid.

Thanks for the reply, much appreciated! If you like, please answer on Stack Overflow too and I will mark as “answered” there as well 🙂

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

Terms & ConditionsCookie settings