My content is overlapping, what to do?
You might look at your message's preview or test emails and see that your content (blocks) is overlapping on top of one another. If this happens, it is probably happening because of the block's height is set to a particular number. This height should never be specified to ensure that your emails adapt to the platform they are opened on (especially important for mobiles), the height is key in responsive html.
To resolve this issue, simply reset the block's height.
To do so:
- View and edit your message
- Click on the block
- Click on edit
- Click on format and then click the arrow "Click to reset"
If this doesn't work and your blocks are still overlapping try to just remove the height number completely: put 0 instead. It might appear again after you erase it, but it should have reset it to the responsive height.
Why you shouldn't specify any height?
When you specify a height, if your message is opened on a mobile, the height is set. Instead of adapting itself to the mobile's dimensions, it will create an overlap since the first block keeps its "set height" and the following blocks overlaps on top and so on.
When you specify a height, you break the responsive template and by doing so, your messages won't adapt to mobiles. Therefore, you should never "play" with this height, instead you should always try to add separators if you want to space out the content in your messages. Remember that the height is a key component to having responsive templates.