# Layout Elements

### Layout Elements&#x20;

You can place any layout element onto your designer canvas to get started. Here's a run-through of each element and how they work to contain your content. Once you have placed your element you control the properties of the element to adjust things like size, space, font, etc.

### Column

Columns are used for grouping content vertically. Just drag and drop it onto your canvas.

<div align="left"><figure><img src="https://1903534506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTY5wPd81K7B5rjyG5tjS%2Fuploads%2FZPuG8Q3uW3ZAcFnmJbvk%2Fnew%20column.png?alt=media&#x26;token=fe4e8543-9fab-4397-b358-7d079e8ccdea" alt=""><figcaption></figcaption></figure></div>

<figure><img src="https://1903534506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTY5wPd81K7B5rjyG5tjS%2Fuploads%2FrqPgyuqDGy3dmuWI6O4q%2Fcolumn%20gif.gif?alt=media&#x26;token=b092fbf7-f3ff-43b2-8e1e-2c6758c52939" alt=""><figcaption></figcaption></figure>

{% embed url="<https://www.youtube.com/watch?index=4&list=PLYXyDMkKKoW1F5-4pUgq9GDwECBqMTzdw&v=vET5ijDlDXY>" %}

### Row

Rows are used for grouping content horizontally. Just drag and drop it onto your canvas.

<div align="left"><figure><img src="https://1903534506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTY5wPd81K7B5rjyG5tjS%2Fuploads%2FGkEKm0nY1VjyFdB8Vq3g%2Fnew%20row.png?alt=media&#x26;token=0b818ef8-f973-49d0-898c-b966b6a6f08b" alt=""><figcaption></figcaption></figure></div>

<figure><img src="https://1903534506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTY5wPd81K7B5rjyG5tjS%2Fuploads%2FL6OYLtvlATwaruY1SEgM%2Frow.gif?alt=media&#x26;token=0195f8f7-988b-4e44-a634-86fd5468a4a5" alt=""><figcaption></figcaption></figure>

{% embed url="<https://www.youtube.com/watch?index=3&list=PLYXyDMkKKoW1F5-4pUgq9GDwECBqMTzdw&v=4d7o4Nwt53U>" %}

### Prespaced Row and Column element

You can also choose to add a pre-spaced element that is made up of rows and columns to speed up your build. You can then add additional elements if you wish to. Just drag and drop it onto your canvas.

<div align="left"><figure><img src="https://1903534506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTY5wPd81K7B5rjyG5tjS%2Fuploads%2FTinUhCLsv03oaQjtquAE%2Fnew%20row%20%26%20coloumn.png?alt=media&#x26;token=ba0a9878-0455-4c83-b23b-1a68b4b87f5a" alt=""><figcaption></figcaption></figure></div>

<figure><img src="https://1903534506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTY5wPd81K7B5rjyG5tjS%2Fuploads%2F69jLYTdnXECmNa9ZBgCT%2Fprespaced.gif?alt=media&#x26;token=28cec562-18f7-4479-b5ef-f02cc6fbdb57" alt=""><figcaption></figcaption></figure>

{% embed url="<https://www.youtube.com/watch?index=5&list=PLYXyDMkKKoW1F5-4pUgq9GDwECBqMTzdw&v=zZoQTrN8yCw>" %}

### Properties

Once you have placed your element, you control the properties of the element to adjust things like size, space, font, etc.

<figure><img src="https://1903534506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTY5wPd81K7B5rjyG5tjS%2Fuploads%2FF5ke8YVULOABdxFxZ7AK%2Fproperties%20pane.png?alt=media&#x26;token=dabaea71-19b3-4ede-b37b-af67de49da75" alt=""><figcaption></figcaption></figure>


---

# 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.documint.me/templates/document-structure-and-layout/page-elements/layout-elements.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.
