---
title: "Grid"
date: 2020-11-17
author: "nK"
---

# Grid

Display your items in a grid layout, where all elements are placed in exact rows for a clean and organized look.

![](https://www.visualportfolio.com/wp-content/uploads/2024/07/Shot-2024-07-12-at-08.42.22-1024x582.png)![](https://www.visualportfolio.com/wp-content/uploads/2024/07/Shot-2024-07-12-at-08.42.22-1024x582.png)    ## Available Settings

- **Columns** – Set the number of grid columns.
- **Images Aspect Ratio** – Set custom aspect ratios for images. By default, the original image ratios are used.
- **Gap** – Set the spacing between gallery items.
- **Vertical Gap** – Optionally set the vertical spacing between gallery items.
- **Items Vertical Align** Pro – Align items when rows have available empty space.

![](https://www.visualportfolio.com/wp-content/uploads/2024/07/Shot-2024-07-12-at-08.43.11-1024x583.png)![](https://www.visualportfolio.com/wp-content/uploads/2024/07/Shot-2024-07-12-at-08.43.11-1024x583.png)    ## Columns[](https://www.visualportfolio.com/docs/gallery-blocks/layout/masonry/#columns)

The Columns setting determines how many vertical columns your grid layout will have. To adjust:

1. Find the **Columns** option in the Grid layout settings.
2. Enter a number or use the up/down arrows to set the desired number of columns.

Remember, the actual number of columns may vary on smaller screens to ensure responsiveness.

## Images Aspect Ratio[](https://www.visualportfolio.com/docs/gallery-blocks/layout/masonry/#images-aspect-ratio)

This setting allows you to override the original aspect ratios of your images. To use:

1. Locate the **Images Aspect Ratio** option.
2. Select your desired ratio (e.g., 16:9, 4:3, 1:1).
3. Use **Auto** to use the original image ratios.

## Gap Settings[](https://www.visualportfolio.com/docs/gallery-blocks/layout/tiles/#gap-settings)[](https://www.visualportfolio.com/docs/gallery-blocks/layout/masonry/#gap-settings)

**Gap** – controls the horizontal space between your gallery items. To adjust:

1. Find the **Gap** option in the Grid layout settings.
2. Enter a value (in pixels) for the desired spacing.

**Vertical Gap** – allows you to set a different spacing for the vertical gaps between items. This can be useful for creating more complex layouts. To adjust:

1. Look for the **Vertical Gap** option in the settings.
2. Enter a value (in pixels) for the vertical spacing.
3. If left empty, it will use the same value as the horizontal Gap.

## Items Vertical Align

Pro FeatureThis is a part of the **Visual Portfolio Pro** plugin.  
Purchase the Pro plugin to access this and other [advanced features](https://www.visualportfolio.com/free-vs-pro/).

[Buy Now](https://www.visualportfolio.com/pricing/)







This Pro feature allows you to control the vertical alignment of items when rows have available empty space. To use:

- Find the **Items Vertical Align** option in the settings.
- Choose from available options (e.g., Top, Middle, Bottom).

This can be particularly useful when your grid items have varying heights.