# Row

A horizontal container. Drop **Column** components inside, and they sit side by side. Rows handle the spacing and wrapping; the columns inside handle their own width.

## Available in

* Page modules
* Order Form modules
* Catalog modules
* Dashboard modules
* Public Page modules

Row isn't available in Modal, Reports, or Navigation modules.

## When to use

* Anywhere you want components side-by-side: a heading + button, a stat card row, a side-by-side form layout.
* As the outer container of a multi-column page section.
* As the building block whenever you'd say "two things next to each other."

For complex alignment or dynamic sizing, reach for **Flex** instead. For uniform tile grids, use **Grid**.

## Settings

| Setting       | Description                                                                                        |
| ------------- | -------------------------------------------------------------------------------------------------- |
| **Gap**       | Spacing in pixels between child columns. Default: 24.                                              |
| **Wrap**      | Whether children wrap to a new line when they run out of horizontal space. Yes / No. Default: Yes. |
| **Printable** | Whether this row appears in the print stylesheet. Default: No.                                     |

## How it works

A Row only accepts **Column** children — drag-drop is restricted to columns. Inside each column you can put any other block.

The Gap setting becomes flex-gap. Width and alignment of each column are configured on the column itself, not on the row.

{% hint style="info" %}
Set **Wrap** to *Yes* (default) so the layout collapses gracefully on smaller screens. Setting it to *No* forces a horizontal scroll on narrow viewports.
{% endhint %}

## Examples

**Header row.** A Row containing two Columns: one with a Heading (left), one with a Button (right). Set Gap to 16.

**Three-card stats bar.** A Row with three Columns, each holding a Stats block. Wrap=Yes so they restack on mobile.

## Related

<table data-view="cards"><thead><tr><th></th><th></th><th data-hidden data-card-target data-type="content-ref"></th></tr></thead><tbody><tr><td><strong>Column</strong></td><td>The container that goes inside a Row.</td><td><a href="/pages/8aNEjXjvJ5ZFtVgxZKrC">/pages/8aNEjXjvJ5ZFtVgxZKrC</a></td></tr><tr><td><strong>Grid</strong></td><td>For uniform tile layouts.</td><td><a href="/pages/6hDoUEHW1NxUqQ5to1CJ">/pages/6hDoUEHW1NxUqQ5to1CJ</a></td></tr><tr><td><strong>Flex</strong></td><td>For complex alignment and sizing.</td><td><a href="/pages/xvomwr5XOTvf1qg9Gl7y">/pages/xvomwr5XOTvf1qg9Gl7y</a></td></tr></tbody></table>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.in8sync.com/client-admin-guide/active-workflows/getting-started/layout-components/row.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.