จะจัดแนวข้อความที่หมุนในตารางได้อย่างไร?

ฉันค้นพบวิธีหมุนข้อความ (ขอบคุณ SO) 90° ปัญหาคือข้อความจะแสดงผลในแนวตั้ง แต่ (ฉันเดาว่า) กล่องจะคำนวณในแนวนอน (ตามที่ ก่อน หมุน)

ฉันมีเซลล์ตารางซึ่งมีข้อความที่หมุนอยู่ และฉันต้องการจัดแนวข้อความที่ด้านบนของเซลล์ เป็นผลให้ฉันได้รับสิ่งนี้:

ข้อความก่อนการหมุน:

rotated90

ข้อความหลังการหมุน (โปรดแก้ตัวภาพหน้าจอ ASCII ของฉัน):

0
9
d
e
t
a
t
o
r

ข้อความที่หมุนจัดชิดด้านบนของเซลล์:

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

จริงๆ แล้วส่วนหนึ่งของข้อความอยู่เหนือเซลล์ ซึ่งถือว่าแย่

ผลที่ต้องการ:

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

คำถาม: วิธีจัดแนวข้อความในแนวตั้ง เช่น จะทำให้เบราว์เซอร์เห็นกล่องเหมือนหลังการหมุน (ไม่ใช่ก่อน) ได้อย่างไร


person greenoldman    schedule 13.05.2011    source แหล่งที่มา
comment
เมธอดของ IE (writing-mode) หมุนโมเดลกล่องสำหรับองค์ประกอบอย่างเหมาะสม แต่ดูเหมือนว่าเบราว์เซอร์ Webkit/Mozilla จะหมุนไม่ได้ :(   -  person drudge    schedule 13.05.2011
comment
@jnpcl ขอบคุณที่เตือนเรื่องนี้ แต่จริงๆ แล้วมันมีข้อ จำกัด เกินไป แม้ว่าฉันจะไม่ได้ใช้ Windows เป็นระบบหลักก็ตาม   -  person greenoldman    schedule 13.05.2011


คำตอบ (1)


ดูเหมือนจะเป็นไปไม่ได้หากไม่ได้ระบุความสูงของเซลล์ที่มีข้อความที่หมุนอยู่

Webkit/Mozilla ดำเนินการหมุนบนหน้าจอขององค์ประกอบ แต่ไม่ใช่รุ่นกล่อง

คุณสมบัติ CSS3 writing-mode ทำงานอย่างถูกต้องใน IE โดยหมุนโมเดลกล่อง เบราว์เซอร์ส่วนใหญ่ควรรองรับคุณสมบัตินี้ แต่บทความที่ฉันอ่านบอกว่าตอนนั้นรองรับเฉพาะ IE เท่านั้น

person drudge    schedule 13.05.2011
comment
เนื่องจากฉันไม่รีบ ฉันจะปล่อยข้อความไว้ในแนวนอน และหลังจากนั้นสักพัก ฉันจะหมุนเวียนโดยใช้โหมดการเขียน โอ้โห WWW คือทุกสิ่ง ยกเว้นการรักษามาตรฐาน :-) - person greenoldman; 13.05.2011