Quick Tip: Removing hairline borders in HTML emails on iPhone & iPad

Nabeel John

We sometimes run into an issue with hairline borders appearing in HTML email designs with table layouts, these borders are sometimes barely visible and appear only at certain zoom levels. This might look something like the image below:

 

This usually happens when you apply background color to two or more table cells individually, like the code below:

To prevent this from happening nest the problematic table into a new table with a background color that matches that of the inner table. For example:

This tip works like a charm and should help you design your emails campaigns better.

About the Author
Nabeel John

Nabeel John is a Digital Marketing Designer at Informz. Outside of work, Nabeel enjoys photography, graphic design and web development.

  • Rizwana Aslam

    I am working with an emailer. Its perfect when viewed in PC n all. Bt when viewed in moblie phone, a vertical borderline appears on the right (nt through the entire length from top to bottom). How to remove it? Plz help

    • Nabeel

      Hi Rizwana, I understand this can be frustrating, is the vertical borderline appearing between the images? Anyway you could send us your code or screenshot so we could examine and find a best solution for you? You can reach our design team at: designers@informz.com

      Thank you,
      Nabeel