Wrap text around an image using float

To float an image to the left and have the text underneath wrap around:

1. Select an image that sits on top of text elements
2. Open layout settings in the Style panel
3. Select float left
4. Add margin to the right and bottom to create space between the image boundaries and wrapping content

When floating an image to the right, remember to add left and bottom margin to create space.

Clearing a wrapped element

To set clear on an element that’s being wrapped:

1. Select the element below a floated element
2. Open layout settings in the Style panel
3. Select the Clear value that you want to set

Creating custom columns with floats

You can use floats to stack elements horizontally and fill up the entire width of a parent element, like the columns element. To create custom columns with floats: 

1. Add a div block on the canvas — this will be your wrapper
2. Add 3 div blocks inside the wrapper
3. Create a class on one of the 3 div blocks you just added
4. Set a width of 33.33% and set float left
5. Apply the same class to the other two div blocks

You can also use floats to shift an element to the left or right within a parent element. The process is the same as floating an image, described above.

Flexbox can accomplish all layout tasks listed above more easily and efficiently. Learn more about using flexbox.

‍