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

TIL 
about CSS and email clients

Avatar for Gunnar Bittersmann Gunnar Bittersmann
January 13, 2020
Programming
0
190

TIL 
about CSS and email clients

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

Avatar for Gunnar Bittersmann

Gunnar Bittersmann

January 13, 2020
Tweet

More Decks by Gunnar Bittersmann

See All by Gunnar Bittersmann
Responsive typography 2
Avatar for Gunnar Bittersmann gunnarbittersmann
0
130
Go home, Prettifier, you’re drunk!!
Avatar for Gunnar Bittersmann gunnarbittersmann
0
87
3 Fehler sind zu finden
Avatar for Gunnar Bittersmann gunnarbittersmann
0
150
TIL that the future :has already begun
Avatar for Gunnar Bittersmann gunnarbittersmann
0
100
TIL how to clear floats
Avatar for Gunnar Bittersmann gunnarbittersmann
0
94
TIL about showModal (from small things big things one day come)
Avatar for Gunnar Bittersmann gunnarbittersmann
0
110
Inclusive Design 24 2022 – Gunnar’s picks
Avatar for Gunnar Bittersmann gunnarbittersmann
0
94
The color rebeccapurple
Avatar for Gunnar Bittersmann gunnarbittersmann
0
150
Mehrsprachige Websites
Avatar for Gunnar Bittersmann gunnarbittersmann
0
97

Other Decks in Programming

See All in Programming
Bedrock AgentCore ObservabilityによるAIエージェントの運用
Avatar for matsukada licux
8
540
decksh - a little language for decks
Avatar for Anthony Starks ajstarks
4
21k
Streamlitで実現できるようになったこと、実現してくれたこと
Avatar for Ayumu Yamaguchi ayumu_yamaguchi
2
260
Workers を定期実行する方法は一つじゃない
Avatar for rokuosan rokuosan
0
140
DatadogのArchived LogsをSnowflakeで高速に検索する方法（Archive Searchでオワコンにならないことを祈って） / How to search Datadog Archived Logs quickly with Snowflake (hoping Datadog Archive Search doesn’t make this obsolete)
Avatar for Civitaspo civitaspo
0
110
React 使いじゃなくても知っておきたい教養としての React
Avatar for Yuka O’oka oukayuka
18
5.1k
新世界の理解
Avatar for Akihito Koriyama koriym
0
110
それ CLI フレームワークがなくてもできるよ / Building CLI Tools Without Frameworks
Avatar for Kuniwak orgachem
PRO
17
3.6k
The Niche of CDK Grant オブジェクトって何者？/the-niche-of-cdk-what-isgrant-object
Avatar for hassaku63 hassaku63
1
740
Vibe Codingの幻想を超えて-生成AIを現場で使えるようにするまでの泥臭い話.ai
Avatar for Kuu fumiyakume
21
10k
「次に何を学べばいいか分からない」あなたへ──若手エンジニアのための学習地図
Avatar for panda_program panda_program
3
700
Claude Code で Astro blog を Pages から Workers へ移行してみた
Avatar for Kei Kamikawa codehex
0
170

Featured

See All Featured
Adopting Sorbet at Scale
Avatar for Ufuk Kayserilioglu ufuk
77
9.5k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
44
7.6k
Optimising Largest Contentful Paint
Avatar for Harry Roberts csswizardry
37
3.4k
Build your cross-platform service in a week with App Engine
Avatar for Jose L jlugia
231
18k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
1
520
Fireside Chat
Avatar for paigeccino paigeccino
37
3.6k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Avatar for Marc Duiker marcduiker
30
2.2k
Music & Morning Musume
Avatar for Bryan Veloso bryan
46
6.7k
The Illustrated Children's Guide to Kubernetes
Avatar for Chris Short chrisshort
48
50k
A designer walks into a library…
Avatar for Paul Jervis Heath pauljervisheath
207
24k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
462
33k
The Web Performance Landscape in 2024 [PerfNow 2024]
Avatar for Tammy Everts tammyeverts
8
730

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