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

# Use Columns for Responsive Layouts

> Use columns to create responsive layouts, organize content side by side, and design structured landing pages across all devices.

Columns allow you to divide a section into multiple vertical areas so you can place content side by side.

They are essential for building structured layouts like:

* Text + Image
* Feature grids
* Multi-column sections

### How to Add Columns

* Open the left sidebar
* Go to **Layout**
* Drag **Columns** into a section

***

## Column Settings

Once selected, you’ll see column controls on the right panel.

### Device-Based Layout

You can define different column layouts for each device:

* **Desktop** → Choose how many columns (1–6)
* **Tablet** → Adjust layout for medium screens
* **Mobile** → Usually set to 1 column for better readability

👉 This ensures your design is responsive across all devices.

***

## Adjusting Column Count and Sizes

You can easily control both the number of columns and how much space each one takes.

* Select the **Columns** element
* Open the **Settings Panel** on the right

### Change Column Count

* Choose a predefined layout (2, 3, 4, etc.)

### Adjust Column Widths

You have two ways:

* **Visual Drag** → Drag the divider between columns directly on the canvas
* This lets you quickly change the width ratio (for example 70/30 or 50/50)

***

## Gap (Spacing Between Columns)

* **Gap** controls the space between columns
* Measured in pixels (px)

Example:

* Gap: 0 → Columns touch each other
* Gap: 20 → Adds space between columns

***

## How Columns Work

* Each column acts like a container
* You can drop elements inside each column
* Columns sit inside sections

Structure example:\
Section → Columns → Elements

***

## Important Notes

* Columns must be inside a section
* Each column can hold multiple elements
* You can change layouts per device for better responsiveness