> For the complete documentation index, see [llms.txt](https://interopxyz.gitbook.io/ui-plus/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://interopxyz.gitbook.io/ui-plus/components/layout/grid-layout.md).

# Grid Layout

Place elements in a grid at row and column indices

## Description

Place elements in a grid at row and column indices

{% tabs %}
{% tab title="Preview" %}
![](https://97674526-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOQQ5Dv56AckPkeQ6O9Rf%2Fuploads%2FdFaMCfNlBF9Yo9IlLHGO%2FGrid.png?alt=media\&token=b736cd9e-f0bb-4b06-a332-a08516f48c22)
{% endtab %}

{% tab title="Location" %}
**Name** | Ui Grid Layout

**Nickname** | Grid&#x20;

**Tab** | Ui

**Panel** | Layout

**Division** | 1
{% endtab %}

{% tab title="Inputs" %}
**E** | **Elements** (*Ui+ Element*) | The Elements and Layouts

**C** | **Columns** (*Integer*) | The column index of each element

**R** | **Rows** (*Integer*) | The row index of each element
{% endtab %}

{% tab title="Ouputs" %}
**E** | **Element** (*Ui+ Element*) | Ui Element Layout.&#x20;
{% endtab %}

{% tab title="Mode" %}
*none*
{% endtab %}
{% endtabs %}

## Usage

![](https://97674526-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FOQQ5Dv56AckPkeQ6O9Rf%2Fuploads%2F0NHueGbNuRXngDEjk0hu%2Fimage.png?alt=media\&token=a62ab8e3-fc5a-4b7d-ae9c-c15ba87fabd0)
