> ## Documentation Index
> Fetch the complete documentation index at: https://docs.makeswift.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Gap

> The gap controls allow you to easily adjust the spacing between elements within a box.

Gap is an easier way to uniformly control spacing between an elements contents. This is a quick and easy way to set and manage consistent margins between all items found within a box.

<Frame>
  <img src="https://mintcdn.com/makeswift/AOijlpVp0npNQ8wB/images/property-panels/Gap.png?fit=max&auto=format&n=AOijlpVp0npNQ8wB&q=85&s=f4cb79534f3f9a02e9b6eb47d0cfd774" alt="Row and Column Gap" width="2000" height="884" data-path="images/property-panels/Gap.png" />
</Frame>

## Row gap

Row gap refers to the distance between elements stacked on top of each other.

## Column gap

Column gap refers to the distance between elements placed next to each other.

## Examples

The most common example of using gap is for sections containing multiple elements or cards. Simply select the smallest corresponding box that contains all the elements you're looking to space out, and utilize your row and column gap controls.

<Frame>
  <img src="https://mintcdn.com/makeswift/AOijlpVp0npNQ8wB/images/property-panels/Gap.gif?s=91757cae28e54531867d8e28ddadd759" alt="Using column and row gap" width="800" height="450" data-path="images/property-panels/Gap.gif" />
</Frame>

## Pro tips

For a list or grid of elements with equal spacing, use the [gap](/product/component/property-controls/gap) control instead of margin or padding. This will ensure consistent and easy to manage spacing between elements.