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

TIL about text-orientation

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →
Avatar for Gunnar Bittersmann Gunnar Bittersmann
January 06, 2020
Programming
250
0

TIL about text-orientation

Lightning talk on vertical text

Avatar for Gunnar Bittersmann

Gunnar Bittersmann

January 06, 2020

More Decks by Gunnar Bittersmann

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

Other Decks in Programming

See All in Programming
Spec Driven Development | AI Summit Lisbon
Avatar for Daniel Sogl danielsogl
PRO
0
230
メソッドのジェネリクスでGoの夢は広がるか？ / Kyoto.go #65
Avatar for utagawa kiki utgwkk
3
1k
その問い、本当に正しいですか？AI時代のエンジニアに必要な哲学と認知科学 / ai-philosophy-cognitive-science
Avatar for MinoDriven minodriven
14
6.6k
1B+ /day規模のログを管理する技術
Avatar for Broadleaf Co., Ltd. broadleaf
0
120
正しくソフトウェアを作る、前提を疑うための認知の視点 / doubt-premise
Avatar for MinoDriven minodriven
21
7.2k
これからAgentCoreを触る方へ トレンドはGatewayです
Avatar for Har1101 har1101
6
460
スマートグラスで並列バイブコーディング
Avatar for Hayami Shuhei hyshu
0
270
TAKTでAI駆動開発の品質を設計する
Avatar for かとじゅん j5ik2o
7
1.6k
LaravelLive Japan の裏方のすべて — 第188回 PHP勉強会＠東京 (2026-06-24)
Avatar for Suguru Oki / スー suguruooki
2
140
The NotImplementedError Problem in Ruby
Avatar for Koichi ITO koic
1
1.1k
コンテキストの使い捨てをやめる — ビジネスルール駆動開発と miko —
Avatar for ioki ioki
0
260
jQueryをバージョンアップする前に使いたいjQuery Migrate
Avatar for Atsushi Matsuo matsuo_atsushi
0
630

Featured

See All Featured
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
Avatar for r-kagaya rkaga
62
44k
Future Trends and Review - Lecture 12 - Web Technologies (1019888BNR)
Avatar for Beat Signer signer
PRO
0
3.6k
Getting science done with accelerated Python computing platforms
Avatar for Jacob Tomlinson jacobtomlinson
2
250
Building a Modern Day 
E-commerce SEO Strategy
Avatar for Aleyda Solis aleyda
45
9.1k
What's in a price? How to price your products and services
Avatar for Michael Herold michaelherold
247
13k
AI Search:
Where Are We & What Can We Do About It?
Avatar for Aleyda Solis aleyda
0
7.7k
Paper Plane (Part 1)
Avatar for Katie Cordina Lindsey katiecoart
PRO
0
9.5k
Agile Actions for Facilitating Distributed Teams - ADO2019
Avatar for Mark Kilby mkilby
0
220
Navigating Weather and Climate Data
Avatar for Ryan Abernathey rabernat
0
270
SEO for Brand Visibility & Recognition
Avatar for Aleyda Solis aleyda
0
4.6k
The Director’s Chair: Orchestrating AI for Truly Effective Learning
Avatar for Mike Taylor tmiket
1
210
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
Avatar for Aleyda Solis aleyda
1
2k

Transcript

  1. TIL about text disorientation

  2. YOURS TRULY

  3. YOURS REALLY TRULY

  4. YOURS REALLY REALLY T

  5. YOURS REALLY REALLY TRULY

  6. 国际化活动W3C万维 ⽹联盟 writing-mode: horizontal-tb

  7. 国 际 化 活 动 W3C 万 维 ⽹ 联

    盟 writing-mode: vertical-rl

  8. YOURS REALLY REALLY TRULY footer { writing-mode: vertical-rl; }

  9. footer { writing-mode: vertical-rl; transform: rotate(0.5turn); } YOURS REALLY REALLY

    TRULY

  10. © YOURS TRULY

  11. © footer { writing-mode: vertical-rl; transform: rotate(0.5turn); } YOURS TRULY

  12. 国 际 化 活 动 W3C 万 维 ⽹ 联

    盟 writing-mode: vertical-rl 国 W © Lo – Letter, other Lu – Letter, uppercase So – Symbol, other

  13. © footer { writing-mode: vertical-rl; transform: rotate(0.5turn); } YOURS TRULY

  14. © footer { writing-mode: vertical-rl; transform: rotate(0.5turn); text-orientation: sideways; }

    YOURS TRULY

  15. - TIL about text orientation