---
title: "12 – 2 images"
slug: "12-2-images"
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.

# 12 – 2 images

## Description

Two images are displayed side by side on desktop and mobile, with the option to stack them on mobile. This block has no other elements, such as text. It is just image-based, but nonetheless extremely useful. The basic two-image block can stack or sit side-by-side on mobile using a toggle. Images and links are editable.

## Default block view

| **Desktop** | **Mobile** |
| --- | --- |
| ![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/43419387-ecf3-4cac-9723-4f6f0a8ab007.png) | ![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/e6ef6751-57dc-4901-9795-fab0cac031b8.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 | 10 |
| Right | 10 |
| Bottom | 10 |
| Left | 10 |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/87b301c2-f036-44dc-8506-54b269b8a9b4.png)

### Stack Mobile Images

Use the toggle to set the image to stack in the mobile view or leave them side by side like the desktop view.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Mobile Images | Stack Mobile Images | Hide |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/08e5fb80-6ad0-4dee-9754-498e805faa7c.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/7cae8a76-1325-4950-839d-2ec4777b1f7b.png)

### Space between Two Images

Choose to increase or decrease the space between the two images when they are side by side in desktop view.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Space between Two Images | Space between two images | #ffffff |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/fcbb526a-ea48-48c7-85ca-ab73ed2325ac.png)

### Links

Add links to the images via the fields in the **Details Tab**.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Links | Image 1 Link | Blank |
| Image 2 Link | Blank |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/7f26d65b-0214-40c0-a069-9841ec4c1f62.png)

### Space between two Images

To increase or decrease the spacing between the images when stacking, edit the option in the **Advanced Tab**.

| **Option** | **Details** | **Default** |
| --- | --- | --- |
| Space between two images | Mobile Space between 2 images | 10 |

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/d2fdc9c1-6776-4027-a454-2f6035591ba0.png)

## Compatibility

There are no known render issues with this block.