Align Images With Text

There are several different ways to display images side by side with text. This guide will show you how.

In this guide

1. Wrap Images and Text
2. Create Columns
3. Show Media & Text Side-by-Side

Wrap Images and Text

If you wish to align an image within a paragraph so that text will wrap around it, follow these steps:

1. Insert an Image block with your image.
2. Type the text onto the next line below the image.
3. Click on the Image block and a toolbar will appear above or below the image.
4. In the toolbar, select to align the image to the left or right, as shown in the GIF below. The text will wrap around the image.
   • Choosing align center will not wrap text around the image.
5. Also demonstrated in the GIF below, you can resize the image to your desired width and height by clicking the blue drag handles.

Create Columns

Using the Columns block, you can create columns to show images and other content next to each other. This is the best option if you wish to have multiple columns, such as an image, some text, and another image all in one row.

An example of using columns to place images next to each other

Quickly insert readymade column designs like this one using Block Patterns.

Show Media & Text Side-by-Side

The Media & Text block is perfect for showing one image (or video) next to some text, as in this example:

“If there’s a book that you want to read, but it hasn’t been written yet, then you must write it.”

— Toni Morrison