> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.maglr.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Rows, columns and elements

|| Grid mode is in beta and available in selected accounts only.

A grid scene is built from rows, columns and elements. Rows run across the page and stack from top to bottom. A row holds elements directly, or holds columns that sit side by side. Columns hold elements. Because content sits in rows and columns, the editor can rearrange it for a small screen: the mobile version is generated from it automatically.

## Rows in a grid scene

A row is a horizontal band across a grid scene. Rows stack from top to bottom, and the scene grows taller with every row you add.

A row holds one of two things:

* one or more elements, placed directly in the row
* two or more columns, to put content side by side

In the Build view, a row at the top level of the page is called a section.

## Columns in a grid scene

A column is a vertical slot inside a row. Columns sit side by side and together fill the row's width. Each column holds its own elements, stacked from top to bottom.

In the Design view, a column can also hold a row of its own, to place content side by side inside a column. In the Build view this is not possible: a column holds elements only.

## Elements in a grid scene

An element is a piece of content, such as a text, heading, image, video or button. In a grid scene, every element sits in a row or in a column. Elements follow the flow of the page: there is no free x/y position.

For the elements you can add, see [Add elements and building blocks](https://help.maglr.com/en/article/add-elements-and-building-blocks-1oleumf/).

## Automatic rows and columns

You don't need to create rows and columns before adding content. They are created when you place content:

* An element placed on the page gets its own row, across the full width.
* An element placed beside another element sits next to it: in the free grid columns beside it if there is room, otherwise the space is split into columns.
* A building block, such as one from `Basic layouts`, adds a ready-made row, often with columns already in it.

For how to add content, see [Add elements and building blocks](https://help.maglr.com/en/article/add-elements-and-building-blocks-1oleumf/).

## The page grid

Every grid scene has a page grid: a set of columns that content lines up with. By default the page grid has 12 columns on desktop and 6 on mobile. Content that follows the page grid snaps to these grid columns, so its width is a number of grid columns.

In the Design view, you can see the grid lines when you hover over the scene. To keep them visible, see [Grid scene settings](https://help.maglr.com/en/article/grid-scene-settings-x7ftdk/).

## Layout types of rows and columns

Every row and column has a layout type that decides how its contents are arranged:

* `Page grid` — the contents follow the page grid. This is the default.
* `Custom grid` — the row or column has its own column grid.
* `Auto Layout` — the contents line up one after another, horizontally or vertically, with a set gap.

When you select a row or column, its layout type is shown as a label on its edge. For how to change it, see [Layout types and position settings](https://help.maglr.com/en/article/layout-types-and-position-settings-25u81/).

In the Build view, layout types can't be changed.

## Frequently asked questions

### Why does my element take up the full width of the page?

An element placed on its own in a grid scene gets its own row, which runs across the full width of the page. To put elements side by side, place an element beside another one, or add a building block with columns. See [Add elements and building blocks](https://help.maglr.com/en/article/add-elements-and-building-blocks-1oleumf/).

### What is the difference between a row and a section?

A section is a row at the top level of the page. The Build view calls these rows sections. The Design view calls every row a row.

### Can I put columns inside a column?

In the Design view, yes: a column can hold a row, and that row can hold columns. In the Build view, no: nested columns are not allowed, and a column holds elements only.