Auto layout makes a frame arrange its children in a row or a column and resize itself around them. It is the difference between a picture of a UI and a UI that survives longer text.
Steps
Select the layers you want grouped and press Shift+A. Figma wraps them in a frame with auto layout on.
In the right panel, choose the direction — horizontal or vertical — and set the gap between items and the padding around them.
Set alignment with the nine-point control: it decides where children sit inside the frame when there is spare room.
Set each child’s resizing: Hug contents means the frame shrinks to fit, Fill container means it stretches, Fixed means it stays put. Most layout problems are one of these three set wrong.
Nest them. A button is a horizontal auto layout inside a card that is a vertical one — that is the normal shape, not an advanced technique.
Worth knowing
If a text layer refuses to wrap, it is set to Hug rather than Fill. If a frame will not shrink, something inside it is Fixed. Absolute position (the icon at the top of the auto layout section) lifts one child out of the flow so you can place a badge on a corner without breaking the row.
Faster than searching: box the part of your screen you
cannot work out and ask about it directly — in Figma or anywhere
else. Answers arrive where you drew the box.