Save 37% off PRO during our Black Friday Sale! »

TIL 
about CSS and email clients

051dbe29a972707cde167602b38c9778?s=47 Gunnar Bittersmann
January 13, 2020
Programming
0
74

TIL 
about CSS and email clients

Lightning talk on how (not) to mess up with CSS in email clients

051dbe29a972707cde167602b38c9778?s=128

Gunnar Bittersmann

January 13, 2020
Tweet

More Decks by Gunnar Bittersmann

See All by Gunnar Bittersmann
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
15
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
8
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
11
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
8
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
9
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
15
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
4
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
7
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
11

Other Decks in Programming

See All in Programming
8d6f91b92f4408a5ed8a4675f9034339?s=48 arigatobank
1
130
E990ee82706811d4fa5bcafa1b4eafbf?s=48 techtekt
0
290
85637f06e3366e5cc4c84780cc346141?s=48 ryunen344
1
280
Ef1341e83c896b7b1c5061674951aa2c?s=48 kumashun
0
1.1k
98b698d47526f827586a7f3946607ef4?s=48 skoji
0
260
Fe9968bc3922faa77939286afda905de?s=48 chloe463
0
800
6b8e2101579190ad96e747e01c279898?s=48 pauloxnet
1
130
7afaad8f870ef79e2c3284a91e13f0b3?s=48 nakabonne
1
250
58d2fa98345951d9a57fdd6cfd5d0f64?s=48 aszx87410
2
330
0ecada41f471c45033ee166c37819915?s=48 artoy
0
180
36e72b299b441378e41b6c445296b959?s=48 achiku
1
230
7fccfb690a818ed2f3a15fc21d426d5a?s=48 texmeijin
0
160

Featured

See All Featured
Fe6b81005d1553accd6b2a28f6a2bef1?s=48 phodgson
92
4.2k
1177e050db6bafe62885362edf6e3537?s=48 lauravandoore
443
29k
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
56
4.9k
C86443373fbfe92996aa882d0d7a59f8?s=48 imathis
484
150k
96270e4c3e5e9806cf7245475c00b275?s=48 addyosmani
1352
200k
96270e4c3e5e9806cf7245475c00b275?s=48 addyosmani
316
21k
D47656e20ff5e42f125fc5ea0fd636c6?s=48 tmm1
64
10k
A60068bce2e73de3a37ca9d2dbe36092?s=48 bryan
105
12k
E837d2996f52008ace055a08fbfff992?s=48 frogandcode
129
20k
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
324
54k
016edace78ffe826f2348d1e0c504afd?s=48 maggiecrowley
16
950
39488f9d172ab92fd352f2cd7b73258d?s=48 mza
82
4.4k

Transcript

  1. TIL about CSS and email clients

  2. T-Mobile.pl

  3. font-family: Abril Text font-family: Abril Text; font-variant-numeric: lining-nums tabular-nums font-family:

    Abril Display; font-variant-numeric: lining-nums tabular-nums

  4. font-family: Georgia font-family: Georgia Pro; font-variant-numeric: lining-nums tabular-nums font-family: Comic

    Sans MS; font-variant-numeric: lining-nums tabular-nums

  5. font-family: Georgia font-family: Georgia Pro; font-variant-numeric: lining-nums tabular-nums font-family: Cambria;

    font-variant-numeric: lining-nums tabular-nums

  6. <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%"> <tbody> <tr> {% for

    digit in digits %} {% if loop.last %} <td align="center" class="counter" style="color:#f64040; font-family:Georgia, sans-serif; font-size:220px;"> {{ number }} "</td> {% else %} <td align="center" class="counter" style="border-right:1px solid #898882; color:#f64040; font-family:Georgia, sans-serif; font-size:220px;"> {{ number }} "</td> {% endif %} {% endfor %} "</tr>

  7. <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%"> <tbody> <tr> {% for

    digit in digits %} {% if loop.last %} <td align="center" class="counter" style="color:#f64040; font-family:Georgia, sans-serif; font-size:220px;"> {{ number }} "</td> {% else %} <td align="center" class="counter" style="border-right:1px solid #898882; color:#f64040; font-family:Georgia, sans-serif; font-size:220px;"> {{ number }} "</td> {% endif %} {% endfor %} "</tr>

  8. <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%"> <tbody> <tr style="color:#f64040; font-family:Cambria,

    Times New Roman, serif; font-size:220px"> {% for digit in digits %} {% if loop.last %} <td align="center" class="counter"> {{ number }} "</td> {% else %} <td align="center" class="counter" style="border-right:1px solid #898882;"> {{ number }} "</td> {% endif %} {% endfor %} "</tr> ☠

  9. T-Mobile.pl

  10. HAPPY END