Overlay text on images

Follow these steps to overlay or offset text on images:

Semplice 4

1. Create a text block directly below or next to your image.
   
   
2. You can use either a positive or negative margin value to offset the text module onto an image. For example, if your image is sitting to the right of your text block, you could give the text block a right margin value of "160".
   
   
3. Assign a Z-index value in your Column styles to the text module. Make sure it is a higher value than the Z-index value of your image column.
   
   
4. Finally, you'll need to adjust these settings for mobile using the responsive editor.

Semplice 5

1. Add a "Text" module below or next to your image.
   
   
2. Use either a positive or negative "Offset" value to move the text module onto an image. In the image example, the image is sitting to the right of the "Text" module. In the "Styling" tab the left "Offset" option was set to "196px".
   
   
3. In the "Miscellaneous" option find the "Stack Order" and use the higher value than your image has so it overlay on top of it.
   
   
4. Don't forget to adjust these settings on smaller breakpoints using the responsive editor, so your content looks nice on all devices.

That should do the trick. Good luck, Mr. or Mrs. Robot!