عادي

  
Normal
  
Normal
  
Rotated
  
Normal

تطبيق CSS التالي:

. statusColumn B { وضع الكتابة: TB-RL ؛ الفضاء الأبيض: Nowrap ؛ العرض: كتلة مضمنة. الفائض: مرئي ؛ التحويل: تدوير (-90deg) ؛ التحويل الأولي: 50 ٪ 50 ٪ ؛ }

  
Normal
  
Normal
  
Rotated
  
Normal

ينتج عن العناصر المجاورة المتداخلة. الهدف من ذلك هو تعديل CSS للتأكد من أن العنصر المدور يؤثر بشكل صحيح على ارتفاع والديه ، ومنع النص تداخل. الموقف: قريب الحدود: 1px الصلبة #CCC ؛ الحشو: 2px ؛ الهامش: 2px ؛ العرض: 200 بكسل ؛ } .statuscolumn i ، .statuscolumn B ، .statuscolumn em ، .statuscolumn Strong { وضع الكتابة: الرأسي RL ؛ التحويل: تدوير (180deg) ؛ الفضاء الأبيض: Nowrap ؛ العرض: كتلة مضمنة. الفائض: مرئي ؛ }

يضمن هذا CSS المحدّث أن العنصر المدور يحترم ارتفاع الحاوية الأم ، وبالتالي منع تداخل النص وتحقيق التصميم المطلوب.