Structural Components

Litehouse Create Grids

A grid is a structural component used to align content elements into columns and rows. Using a grid makes your content appear to flow more naturally on your page.

Grids are fluid and will automatically flow in size to take the maximum available width.

Grids divide horizontal space into structural units called columns.

 

By adding a grid, you will automatically create your first column. Columns allow you to arrange different types of content elements (text, image, video, etc.) into different vertical and horizontal layouts.  

 

Litehouse Create grids allow you to choose by default a maximum of 4 columns per row.  

See available layouts for grids and columns in the column tutorial.

Adding a grid to a section

1. In the editor mode, click on the plus symbol to insert a new component from the options available

2. Select Grid

3. A grid containing one column will automatically by added

4. Start editing the content of the column

5. Save and view your edits

Adding a column to a grid

1. In the editor mode, click on the plus symbol to insert a new component from the options available

2. Select Grid

3. A grid containing one column will automatically by added

4. Start editing the content of the column

5. Save and view your edits

How to style your grid

1. Click on Grid and open the options menu

2. Go to Settings > Style  

3. Adjust the Background, Width and Padding of your grid  

4. You can also change how many parts a column takes in your grid, by adjusting the Column Size