html - 如何在 div 中间对齐旋转的文本

Question

我想在 100% 高度 div 的中间垂直对齐旋转的文本，如下图所示。

因此，每当屏幕大小发生变化时，文本都会停留在 div 的中间。

有人对此有解决方案吗？

http://jsfiddle.net/SVkPU/1/

.rotate-270 {
    -o-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform:rotate(270deg);
}

.left {
    float:left;
    background:#000;
    color:#fff;
    text-align:center;
    height:50px;

}

.right {
    float:right;
    background:#000;
    color:#fff;
}

Answer 1

那么 Buddy Addtext-align:center的<div>然后而不是在 90 度旋转文本！旋转<div>90 度！

http://jsfiddle.net/KSAqR/1/

Answer 2

这对我有用： http: //davidwalsh.name/css-vertical-text

还尝试使用弹性盒。但是由于它们（仍然）没有得到所有浏览器的完全支持，尤其是（移动）safari - 它必须在其上工作，所以我采用了更受支持的方法。