Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

TIL 
about CSS and email clients

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

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

More Decks by Gunnar Bittersmann

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

Other Decks in Programming

See All in Programming
Spec-Driven Development - Why Vaadin Is the Perfect Fit
Avatar for Simon Martinelli simas
PRO
0
240
AIが生成したコードは読むべきか？抽象化設計とコードの品質保証 / abstraction-design-and-quality
Avatar for MinoDriven minodriven
16
8.9k
クラウドエージェントは、 何がそんなに便利なのか / what makes cloud agents so useful
Avatar for r-kagaya rkaga
5
820
Crash Auto Pipelines
Avatar for Veronikapj veronikapj
1
410
Modernizing iOS Apps
Avatar for seyfeddin seyfoyun
0
150
SODA - FACT BOOK（EN）
Avatar for SODA inc. sodainc
1
220
AI時代のIaC入門 〜なぜインフラをコードで管理したいのか？〜 / Introduction to IaC in the AI Era
Avatar for アキキー | Akihisa Ikeda akihisaikeda
6
1.5k
学びを記事・スライド・Xへ高速展開する― AI-assisted Learning Loopで回すコンテンツ生成術
Avatar for Ochtum ochtum
0
200
Coding with AI: How to trust the storyteller (AWS Community Day Adria, Ljubljana 2026)
Avatar for Slobodan Stojanović slobodan
0
140
作って学ぶSpring BootのAuto Configuration / JJUG Night Seminar 2026-10-19
Avatar for Ryo Shindo rshindo
0
220
AI-Powered Domain-Driven Design
Avatar for Alberto Brandolini ziobrando
0
420
TS 7.0 で baseUrl が使えなくなった今、パスエイリアスをどうするか
Avatar for おおいし bicstone
2
590

Featured

See All Featured
Product Roadmaps are Hard
Avatar for C. Todd Lombardo iamctodd
55
13k
How to build a perfect <img>
Avatar for Jono Alderson jonoalderson
1
6.2k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
239
140k
How To Speak Unicorn (iThemes Webinar)
Avatar for Michelle Schulp Hunt marktimemedia
1
630
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
247
13k
Visualization
Avatar for Eitan Lees eitanlees
153
17k
brightonSEO & MeasureFest 2025 - Winning Strategies for Black Friday CRO & PPC - Christian Goodrich
Avatar for Christian Goodrich cargoodrich
3
890
Building a A Zero-Code AI SEO Workflow
Avatar for Ian Lurie portentint
PRO
0
820
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
615
220k
A Soul's Torment
Avatar for Nat Ma seathinner
8
3.9k
How to Grow Your eCommerce with AI & Automation
Avatar for Katarina Dahlin katarinadahlin
PRO
2
350
The Power of CSS Pseudo Elements
Avatar for Geoffrey Crofte geoffreycrofte
82
6.6k

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