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

TIL about text-orientation

051dbe29a972707cde167602b38c9778?s=47 Gunnar Bittersmann
January 06, 2020
Programming
0
150

TIL about text-orientation

Lightning talk on vertical text

051dbe29a972707cde167602b38c9778?s=128

Gunnar Bittersmann

January 06, 2020
Tweet

More Decks by Gunnar Bittersmann

See All by Gunnar Bittersmann
Frühstück mit Pu
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
9
Grid to the future, Part II
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
4
CSS for Designers
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
36
Früchte des Zorns
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
13
TIL about coming downstairs
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
17
ISO 9241 – Ergonomie der Mensch-System-Interaktion
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
58
TIL :where the fun :is
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
18
What a kerning!
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
32
TIL where no one has gone before
051dbe29a972707cde167602b38c9778?s=48 gunnarbittersmann
0
23

Other Decks in Programming

See All in Programming
Edge Side Frontend という新領域
3aebd86547bfc5cdb451d5f2f95ed5d8?s=48 mizchi
22
10k
プロダクトの成長とSREと
5a9fb3b80c517e51e4e95a27b63c6a67?s=48 takuyatezuka
0
120
「混ぜるな危険」を推進する設計
8ec2b967e38f000eb63ae345cd7c58e6?s=48 minodriven
8
2.5k
Isar勉強会
693ed679c8dde3eccbc682ff44f357e1?s=48 hoddy3190
0
390
SAM × Dockerでサーバーレス開発が超捗った話
Cd029ecf0f2e807120fcf05161ce84b8?s=48 yu_yukk_y
1
200
Getting Started With Data Structures
Fbe54abf4094d19f1548783d072a7fa7?s=48 adoranwodo
1
260
企業内スモールデータでのデータ解析
6aceb3377c71b05c1285459c596d1d1f?s=48 hamage9
0
880
Rust、何もわからない...#3
5d9c07f0c2044b1407a84d88362bc84d?s=48 estie
0
150
リーダブルテストコード / #vstat
48a913a2e3bb5e68aae6f73079648e84?s=48 jnchito
47
35k
クックパッドマートの失敗したデータ設計 Before / After 大放出
0be62f7ac4cc32f37f02a98aaeb86f5f?s=48 mokuzon
20
25k
ESM移行は無理だけどおれもSindreのライブラリが使いたい！
208355d7af69fa84a78048f78077048a?s=48 sosukesuzuki
2
540
僕が便利だと感じる Snow Monkey の特徴/20220723_Gifu_WordPress_Meetup
Dda24cce92447593513292ec748c70c4?s=48 oleindesign
0
110

Featured

See All Featured
The World Runs on Bad Software
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
57
5.4k
JavaScript: Past, Present, and Future - NDC Porto 2020
3ab1249be442027903e1180025340b3f?s=48 reverentgeek
37
3.3k
A Tale of Four Properties
8081b26e05bb4354f7d65ffc34cbbd67?s=48 chriscoyier
149
21k
Six Lessons from altMBA
766b9746b59e6f09e280cd33cf4ed419?s=48 skipperchong
14
1.4k
What’s in a name? Adding method to the madness
C0390e8b11079f8761c0cd3274ed61cb?s=48 productmarketing
11
1.6k
Designing with Data
F57e2136eb9895eb95ff5dc8a1c02677?s=48 zakiwarfel
91
4k
Producing Creativity
Ae14cc4491ac334f9cd23f9f93b4305e?s=48 orderedlist
PRO
334
37k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
Fd55de4174accaf3b4f030e43a8a70c6?s=48 marcduiker
6
560
Done Done
282d599b414022eba5096510f675b6e2?s=48 chrislema
174
14k
Designing Experiences People Love
1b75d89772b7eea1f6c89fbf362607d9?s=48 moore
130
22k
4 Signs Your Business is Dying
E4f5d494ebdc9e7cce1aecf3ce3e8bc1?s=48 shpigford
169
20k
Debugging Ruby Performance
D47656e20ff5e42f125fc5ea0fd636c6?s=48 tmm1
65
10k

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