Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG] Default example kitchenSink.jsx does not display well in default Galaxy S6 email client. #67

Open
kopax opened this issue Oct 6, 2018 · 2 comments
Open

[BUG] Default example kitchenSink.jsx does not display well in default Galaxy S6 email client. #67

kopax opened this issue Oct 6, 2018 · 2 comments

Comments

@kopax
Copy link

kopax commented Oct 6, 2018 •
edited
Loading

Dear everyone,

I have tested with my Galaxy S6 edge default mail client and I was surprised to see that my template was not working well.

I have then tested with the default and found it to be a non working example:

image

The content does not display as in thunderbird:

image

I have reduced the amount of the example code and noticed that it was still present when I only have:

<Email title="Test Email" headCSS={css}>
  <Span fontSize={15}>Hello, world!</Span>
</Email>

It generates the following HTML (from thunderbird sourcecode)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.=
org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html lang=3D"en" xmlns=3D"http://www.=
w3.org/1999/xhtml"><head><meta http-equiv=3D"Content-Type" =
content=3D"text/html; charset=3Dutf-8"/><meta name=3D"viewport" =
content=3D"width=3Ddevice-width, initial-scale=3D1.0"/><title>Test =
Email</title></head><body style=3D"width:100%;margin:0;padding:0;-webkit-te=
xt-size-adjust:100%;-ms-text-size-adjust:100%"><table width=3D"100%" =
height=3D"100%" cellPadding=3D"0" cellSpacing=3D"0" border=3D"0" =
align=3D"left" valign=3D"top"><tbody><tr><td align=3D"center" =
valign=3D"top"><table width=3D"600" align=3D"center" cellPadding=3D"0" =
cellSpacing=3D"0" border=3D"0" valign=3D"top"><tbody><span =
style=3D"font-family:sans-serif;font-size:15px;line-height:15px;color:#000"=
>Hello, world!</span></tbody></table></td></tr></tbody></table></body></htm=
l>
  • Why does it generate two tables just for that simple email? it looks really dumb but I must be missing something.

If I keep just the <Span> the text can display well

<Span fontSize={15}>Hello, world!</Span>

But then the source code looks like:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.=
org/TR/xhtml1/DTD/xhtml1-strict.dtd"><span style=3D"font-family:sans-serif;=
font-size:15px;line-height:15px;color:#000">Hello, world!=
</span>

I also see this guys fixing height issues for some other mail client: https://github.com/impossibleventures/react-html-email/commit/bc24f3a02be2c20ab9a5768c117e986691d159cb

This package seems to not be ready for production, is anyone aware of this? How should we fix it?
@kopax
Copy link
Author

kopax commented Nov 16, 2018 •
edited
Loading

Any update on this?

Dur anybody expérience issue with android mail client and the display of the example ?

@kopax
Copy link
Author

kopax commented Dec 27, 2019

Still no update on this ?

Can we at least tag it to

~bug
/~bug
/label bug

?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@kopax