Arah Block dan Inline

Arah blok adalah arah penumpukan kotak tingkat blok. Dalam sistem penulisan horizontal (LTR/RTL), arah blok adalah dari atas ke bawah. Dalam mode penulisan vertikal, arahnya berubah menjadi dari kiri ke kanan atau dari kanan ke kiri.

Arah sebaris adalah arah aliran teks dalam satu baris. Dalam bahasa LTR, arah sebaris adalah dari kiri ke kanan. Dalam RTL, arahnya dari kanan ke kiri. Dalam mode penulisan vertikal, arahnya menjadi dari atas ke bawah.

writing-mode menetapkan orientasi dasar aliran teks:

• horizontal-tb — teks horizontal, dari atas ke bawah (bawaan)
• vertical-rl — teks vertikal, kolom dari kanan ke kiri
• vertical-lr — teks vertikal, kolom dari kiri ke kanan

Dalam writing-mode: horizontal-tb (bawaan):

• Arah blok = vertikal (atas → bawah)
• Arah sebaris = horizontal (kiri → kanan dalam LTR, kanan → kiri dalam RTL)
• Awal blok = atas, akhir blok = bawah
• Awal sebaris = kiri (LTR) atau kanan (RTL)

Dalam writing-mode: vertical-rl:

• Arah blok = horizontal (kanan → kiri)
• Arah sebaris = vertikal (atas → bawah)
• Awal blok = kanan, akhir blok = kiri
• Awal sebaris = atas, akhir sebaris = bawah

Bayangkan ini sebagai sistem koordinat yang berputar mengikuti mode penulisan. Properti logis menjelaskan posisi relatif terhadap sistem yang dapat diputar ini, bukan terhadap layar yang tetap.

Dalam mode penulisan vertikal, text-orientation mengontrol orientasi setiap karakter:

• mixed: Putar karakter Latin; pertahankan CJK tetap tegak
• upright: Semua karakter tetap tegak (untuk CJK vertikal)
• sideways: Semua karakter diputar menyamping

Salah satu penggunaan praktisnya adalah label bilah sisi atau label sumbu grafik yang diputar dalam konteks penulisan horizontal:

Sebuah kontainer dapat menggunakan satu mode penulisan, sementara setiap elemen sebaris menggunakan mode lain. Hal ini digunakan untuk mencampur teks Latin dan CJK dalam paragraf yang sama.

Padanan logis untuk lebar dan tinggi:

• inline-size = lebar dalam horizontal-tb (dimensi sebaris)
• block-size = tinggi dalam horizontal-tb (dimensi blok)

Untuk teks vertikal yang menyertakan angka atau singkatan, text-combine-upright (tcy) membuat rangkaian pendek karakter tetap tegak dan dipadatkan dalam satu sel teks vertikal.

Dalam writing-mode: horizontal-tb dengan bahasa LTR, sumbu manakah yang menjadi sumbu blok?

Sumbu blok adalah arah penumpukan kotak blok; sumbu sebaris adalah arah aliran teks. Dalam sistem penulisan horizontal, blok = vertikal dan sebaris = horizontal. Dalam penulisan vertikal, keduanya beralih. writing-mode mengontrol orientasi dasar sumbu. Properti logis beradaptasi dengan sumbu yang sedang menjadi sumbu blok dan sebaris.