Bootstrap Twitter CSS не работает в Gmail - PullRequest
4 голосов
/ 26 марта 2012

Я использовал Bootstrap Twitter для HTML форматирования дайджеста электронной почты.

Форматирование выглядит хорошо в Mail (почтовый клиент Mac), но когда я проверяю свою почту через браузер, форматирование не применяется, поэтому оно невыглядит слишком красиво.

Есть идеи, почему это происходит?

Мой макет электронной почты:

<!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>
       ...

CSS-форматирование начальной загрузки Twitter из digest.html.erb не применяется и не отображается при просмотре в Gmail.Форматирование выглядит хорошо в моем почтовом клиенте Mail (mac).

Источник из электронной почты в gmail:

----==_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.local.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/>
    ....\

Я замечаю все эти 3D-префиксы и некоторые случайные = в тексте, но яне верь, что это проблемаЕсть идеи?

Ответы [ 3 ]

4 голосов
/ 06 апреля 2012

прочитайте эту статью , которая объясняет, что <head> часто игнорируется почтовыми клиентами. Как правило, вы хотите включить все стили в тег body, желательно, применив их к каждому элементу

* 1006 т.е. *

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

вы тоже должны исправить эти опечатки, они вам не помогут

0 голосов
/ 05 июля 2012

Другим полезным ресурсом является эта статья , в которой объясняется, как получить хорошо выглядящие электронные письма и почему то, что вы пытаетесь сделать, не удастся с Gmail, Outlook и т. Д.

0 голосов
/ 06 апреля 2012

В этом Railscast рассказывается, как получить хорошо выглядящее html-письмо с рельсов: http://railscasts.com/episodes/312-sending-html-email

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...