Bagaimana cara menyelaraskan teks yang diputar dalam tabel?

Saya menemukan cara memutar teks (berkat SO) sebesar 90°, masalahnya adalah teks dirender secara vertikal, tetapi (saya kira) kotak dihitung secara horizontal (seperti sebelum berputar).

Saya memiliki sel tabel yang berisi teks yang diputar, dan saya ingin menyelaraskan teks di atas sel. Hasilnya saya mendapatkan sesuatu seperti ini:

Teks sebelum rotasi:

rotated90

Teks setelah rotasi (mohon maafkan tangkapan layar ASCII saya):

0
9
d
e
t
a
t
o
r

Teks yang diputar sejajar dengan bagian atas sel:

0
9
d
e
-----------
t
a
t
o
r

Jadi sebenarnya sebagian teks berada di atas sel, dan itu buruk.

Efek yang diinginkan:

-----------
0
9
d
e
t
a
t
o
r

PERTANYAAN: bagaimana cara menyelaraskan teks secara vertikal, yaitu bagaimana membuat browser melihat kotak seperti setelah (bukan sebelum) rotasi?


html alignment css tablelayout
person greenoldman    schedule 13.05.2011    source sumber
comment
Metode IE (writing-mode) memutar model kotak untuk elemen dengan benar, tetapi sepertinya tidak dilakukan oleh browser Webkit/Mozilla. :(   -  person drudge    schedule 13.05.2011
comment
@jnpcl terima kasih sudah mengingatkan, tapi memang terlalu membatasi, lagipula saya tidak menggunakan Windows sebagai sistem utama.   -  person greenoldman    schedule 13.05.2011

Jawaban (1)


arrow_upward
1
arrow_downward

Sepertinya hal ini tidak mungkin dilakukan tanpa menentukan tinggi sel tempat teks yang diputar berada.

Webkit/Mozilla melakukan rotasi pada tampilan elemen, tetapi tidak pada model kotaknya.

Properti CSS3 writing-mode berfungsi dengan baik di IE, memutar model kotak. Properti ini seharusnya didukung oleh sebagian besar browser, tetapi artikel yang saya baca mengatakan bahwa properti ini hanya didukung oleh IE pada saat itu.

person drudge    schedule 13.05.2011
comment
Karena saya tidak terburu-buru, saya akan meninggalkan teks saya secara horizontal, dan setelah beberapa waktu saya akan memutarnya menggunakan mode penulisan. Ya ampun, WWW adalah segalanya, kecuali menjaga standar :-). - person greenoldman; 13.05.2011