Upgrade to Pro — share decks privately, control downloads, hide ads and more …

TIL 
about CSS and email clients

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

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
3
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
2
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
7
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
47
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
29
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
14
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
1
33
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
36
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
2
22

Other Decks in Programming

See All in Programming
A1792748885fe8f2555d9c718ee7ae53?s=48 joytomo
1
520
Bbb17eeeecd3d9d06f4db310ab630a12?s=48 borkdude
1
170
D30b39411129795f28140809e9694265?s=48 nori0__
1
480
E0e036f89c14b3e59640318eedf9670b?s=48 bkuhlmann
6
700
80728f01bc074c5c2f0d4859258bd793?s=48 ickx
3
620
C90bac78c0fb61105cfd8239767f903d?s=48 o0h
PRO
0
310
2e72046813bf3dc01173fe54919a6d1d?s=48 cc4966
1
100
Ec2fcdc4ea7905b289967a2c4c43e154?s=48 sgeengineer
1
190
75baf8a56acce7086013da05fd125af5?s=48 dhmegane
0
210
E505897a79eede1a676f92740261e8f8?s=48 kubode
2
190
394576121c6b861048493988254160dd?s=48 tarappo
4
430
D0a6969000c3715087b3a00abd646d20?s=48 timeseriesfr
0
100

Featured

See All Featured
C51b39fa3c79ccb99dcb8a076bc98287?s=48 brianwarren
82
4.8k
88bc30284c6a424b63a92aad27d0ba36?s=48 jnunemaker
PRO
40
4.7k
E4f5d494ebdc9e7cce1aecf3ce3e8bc1?s=48 shpigford
370
42k
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
19
1.3k
D8fc2580cfaca035f666d9e4ee79a7f7?s=48 mongodb
23
3.9k
E14f55d3f939977cecbf51b64ff6f861?s=48 keithpitt
402
20k
B3d6434763caa0ef5dc4b792662c49f7?s=48 smashingmag
283
47k
5f2da528927a2ec9ba4fec2069cbc958?s=48 kneath
220
15k
3ab1249be442027903e1180025340b3f?s=48 reverentgeek
167
7.3k
A9a491b0fcbe0fbce3d64063a37add99?s=48 rmw
12
870
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
408
58k
56c4053438af8e8b90d6f53cbb7573be?s=48 jakevdp
776
200k

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