search

mjmlio / mjml

MJML: the only framework that makes responsive-email easy
https://mjml.io
MIT License
16.72k stars 942 forks source link

Additional pixel line appear above image #2630

Closed TechBill closed 1 year ago

TechBill commented 1 year ago

Describe the bug There an extra pixel line that appears above the image

Try it Live link - https://mjml.io/try-it-live/ZptdCiXq-

Very basic MJML a signature box ... no matter what client .. Outlook or Gmail etc .. line still appear above image .. I tried everything like border="0" or padding-"0" on every component possible. Still show a pixel line above the image ..

At first I thought that stupid Outlook bug until I noticed it also happens in other clients too ...

Affected email clients (for rendering issues): All emails client

Screenshots Screenshot 2023-02-09 at 3 05 30 PM

Additional context Add any other context about the problem here.

iRyusa commented 1 year ago

Doesn't seem to appear if you minify the output. Can you confirm ?

It looks like a weird bug with vertical-align: middle

TechBill commented 1 year ago

It still appear in both Gmail and Outlook with the output mifitfied.

https://mjml.io/try-it-live/_hknWmUcO

iRyusa commented 1 year ago

I'm not able to reproduce on emailonacid: image

TechBill commented 1 year ago

I'm not able to reproduce on emailonacid

Web Gmail I don't see this extra pixel but I see it on Apple email with gmail setup and Outlook.

iRyusa commented 1 year ago

Outlook 2016 and 2019 does the same image the whiteline should disappear when playing with font size value/ line height and other thing

iRyusa commented 1 year ago

And iOS mail / gmail same : image

TechBill commented 1 year ago

Closing this. I was able to fix it by changing the width percentage slightly and it'll disappear.

Example 50% 50% column shows a line and changing it to 49% 51% column removes the line.