У меня есть следующий HTML:
<div class="outer">
<div class="inner rotate">Centered?</div>
</div>
div.outer
представляет собой узкую вертикальную полосу. div.inner
поворачивается на 90 градусов. Мне нужен текст "Центрированный?" чтобы оказаться центрированным в своем контейнере div. Я не знаю размер div заранее.
Это близко: http://jsfiddle.net/CCMyf/2/. Вы можете видеть из jsfiddle, что текст вертикально центрирован до применения стиля transform: rotate(-90deg)
, но после этого несколько смещается. Это особенно заметно, когда div.outer
является коротким.
Можно ли центрировать этот текст вертикально, не зная заранее какого-либо размера? Я не нашел никаких значений transform-origin
, которые решают эту проблему.