All geek questions in one place

CSS boot tweeter error in gmail

I used Bootstrap Twitter in HTML digest format.

Formatting looks great in Mail (Mac email client), but when I check my gmail from my browser, formatting is not applied, so it doesn’t look very good.

Any idea why this is happening?

My email layout is:

<!DOCTYPE html> <html> <head> <meta content='text/html; charset=UTF-8' http-equiv='Content-Type' /> <link href='http://twitter.github.com/bootstrap/assets/css/bootstrap.css' rel='stylesheet' /> </head> <body id='email'> <div class="container"> <%= yield %> </div> </body> </html>

digest.html.erb

  <div class="row"> <div class="span4">...</div> </div> ...

The CSS CSS bootstrap format from digest.html.erb does not apply or display when viewed in Gmail. Formatting really works well in my Mail (mac) mail client.

Source from gmail email:

 ----==_mimepart_4f71da44a148b_612e3fe48e034ec4200f0 Date: Tue, 27 Mar 2012 17:18:28 +0200 Mime-Version: 1.0 Content-Type: text/html; charset=UTF-8 Content-Transfer-Encoding: quoted-printable Content-ID: < 4f71da44b71dc_612e3fe48e034ec4202ee@joel-maranhaos-macbook-pro.l ocal.mail> <!DOCTYPE html> <html> <head> <meta content=3D'text/html; charset=3DUTF-8' http-equiv=3D'Content-Ty=pe' /> <link href=3D'http://twitter.github.com/bootstrap/assets/css/bootstrap=.css' rel=3D'stylesheet' /> </head> <body id=3D'email'> = <div class=3D"container"> <br/> ....\

I notice all these 3D prefixes and some random = in the text, but I don't think this is a problem. Any ideas?

+4
source share
3 answers

read this article explaining that <head> often ignored by email clients. Typically, you want to include all styles within the body tag, preferably by applying them to each element

i.e

 <p style="font-family:pupcat;text-size:15px;line-height:19px;">Blah</p>

you must also correct these typos, they will not help you

+4
source

This railscast talks about how to get a beautiful gtml email address from rails: http://railscasts.com/episodes/312-sending-html-email

0
source

Another useful resource is in this article , which explains how to receive good emails and why what you are trying to do will fail with Gmail, Outlook, etc.

0
source

Source: https://habr.com/ru/post/1403510/

More articles:


All Articles