Using padding to control spacing

There are notably that Outlook (surprise surprise!) has some funky interactions between margins and background colors.

It’s also very common in web development to utilize margins with negative values to control positioning of elements and create some clever layouts. Unfortunately that isn’t well supported in email clients with some of the major players such as Outlook, Gmail and iOS all lacking support.

For these reasons, if you’re going to go the inline style route for controlling your spacing around images, we recommend you

Including the spacing in your images

An older method for creating spacing around your images is to include the spacing inside your images. This used to be quite commonplace   India Business Fax List but has more recently fallen out of fashion.

The advantage to this method is that it allows you to add spacing around your images without having to dive into the code. When you’re saving your images to use in your email, simply add some space in the area you desire your spacing to be before you save it out as seen in our example.

We want to add a 20 pixel space below and to the right of the image, so we add that in our image as we save it.

We already mentioned that the lack of coding knowledge

Fax Number List

needed to implement this is a big plus for this method but what about the drawbacks? First, if you want to adjust the spacing across many images it’s going to be very time consuming to edit a slew of images and save them out. Secondly, if you need to change the spacing you’ve added to an image it’s going to involve opening the image, changing the spacing and then re-exporting it.

Finally, you’ll need to make sure you’re aware of how If you’re including a colored background in your image for spacing and dark mode is altering the background color of your email it could have some adverse effects.

Overall, we don’t recommend using this method for spacing due to the drawbacks above. But if you aren’t comfortable editing email code, and you need to very quickly add spacing in one or two places, this could be a quick-fix you can employ.

Using table structure to control spacing

Our final method of controlling the spacing around images in your email is another solution that requires neither  Aero Leads padding or margins.

Using tables made up of rows and cells is the most common approach in email development for controlling layout. We can also use this table structure to add spacing around our images

 

Leave a comment

Your email address will not be published. Required fields are marked *