Use float to wrap text around images and clear a wrapped element.
To float an image to the left and have the text underneath wrap around:
- Select an image that sits on top of text elements
- Open layout settings in the Style panel
- Select float left
- 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:
- Select the element below a floated element
- Open layout settings in the Style panel
- 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:
- Add a div block on the canvas — this will be your wrapper
- Add 3 div blocks inside the wrapper
- Create a class on one of the 3 div blocks you just added
- Set a width of 33.33% and set float left
- 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.