Table with mobile/tablet resolution spacing

Asked

Viewed 47 times

1

Developing an email marketing, I came across spacings (of approximately 1px) that appear between the columns but this spacing only appears in resolutions smaller than 980px.

The code was generated through the Fireworks software and had some modifications made by me after.

I’ve used several techniques like removing edge, padding and Spacing from the table but it still didn’t work.

Following image below:

inserir a descrição da imagem aqui

Follows code: https://guitarcamera.com/email-marketing/watch-demo/watch-demo.html

  • Try to give a display: block; in the image

  • @Good afternoon caiocafardo. There is already a rule for display:block in all images.

  • But this error you saw was after you emailed it? Because in many cases, the email reader reads only inline css.

  • @caiocafardo I initially noticed this error after sending the email and opening it on mobile. After that I verified that in the browser, below 980px, this also happened. In larger resolutions this does not happen.

1 answer

0


After much research I found that the term for this problem is "hairline".

It is a standard behavior that occurs in most mobile devices. There is no method to solve it, only it is possible to disguise it by placing the background or edges with the predominant or background color (usually white).

The tip for those who are going through this is to avoid creating email marketing that you need to create clippings in images.

Follow the source: https://litmus.com/community/discussions/5230-hairline-lines-around-images-in-tables

Browser other questions tagged

You are not signed in. Login or sign up in order to post.