---
title: "09 – Spacer"
slug: "09-spacer"
updated: 2024-07-11T15:07:34Z
published: 2024-07-11T15:07:34Z
---

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

# 09 – Spacer

## Description

The simple Spacer block may be simple, but it is one of the most important features of any email. Every design relies on 'space', no matter the industry. This block has the added function to hide/show a keyline or just render it in desktop view. It can also edit the thickness and color and set the widths on desktop and mobile using a percentage.

## Default block view

**Desktop**

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/4fb6c384-f636-4b23-b2fc-999de0cff3f1.png)

**Mobile**

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/c23dbdab-d7e4-48a6-986d-942abb6720f8.png)

## Formatting options

### Padding

This refers to the space between the block's content and its border. This can be edited in the **Details Tab**.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Padding | Top & Bottom | 10 |
| Left & Right | 0 |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/9d9331da-08b3-4472-82d2-986c24ae4e23.png)

### Hide/Show Line

Used to set the hide and show options for desktop and mobile.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Hide/Show | Desktop | Show |
| Mobile | Hide |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/c78f8f28-ce65-4c1b-9e47-d12296f8678f.png)

### Block Background Color

Used to change the block background color. Only use HEX color values. HTML email only recognizes 6-digit long-hand versions and has patchy support for shorthand versions.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Background Color | Block Background Color | #ffffff |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/e0b39195-f2c3-4347-bfa4-9025b46a528e.png)

### Line Thickness

It allows you to change the thickness of the spacer.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Line Thickness | Line Thickness | 2 |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/fe9ee9fd-9770-40fe-a8d3-55e31dbd91db.png)

### Line Color

It allows you to change the color of the spacer.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Line Color | Line Color | #cccccc |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/5d43c5bd-bf55-465f-bff1-19f75bc476ec.png)

### Line Width %

It allows you to change the width of the spacer in % level.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Line Width % | Line Width % | 100 |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/8d7217d6-ce65-4a05-8d5f-3377c049a2db.png)

## Compatibility

There are no known render issues with this block.