CSS縦テキスト

Question

可能性の重複：
css vertical centering

私は、画面の側面に垂直タブの中央にテキストを取得しようとしています。これまでのところ私はthe following CSS and HTMLを持っている：

CSS

body 
{ 
    font-family: Arial; 
} 
.panel 
{ 
    position:absolute; 
    top: 0px; 
    bottom: 0px; 
    left: -300px; 
    width: 299px; 
    border-right: 1px solid black; 
} 

.tab 
{ 
    position: absolute; 
    top: 10px; 
    width: 16px; 
    right: -16px; 
    height: 75px; 
    border-top: 1px solid black; 
    border-bottom: 1px solid black; 
    border-right: 1px solid black; 
    cursor: default; 
} 

.tab div 
{ 
    position: relative; 
    display: block; 
    left: 1px; 
    width: 75px; 
    height: 15px; 
    font-size: 14px; 
    font-weight:normal; 
    line-height: 15px; 
    text-align: center; 
    -moz-transform:rotate(-270deg); 
    -moz-transform-origin: bottom left; 
    -webkit-transform: rotate(-270deg); 
    -webkit-transform-origin: bottom left; 
    -o-transform: rotate(-270deg); 
    -o-transform-origin: bottom left; 
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); 
} 

HTML

<div class="panel"> 
    <div id="pnlStack" class="tab"><div>Name</div></div> 
</div> 

すべて（FF、オペラ、クロームIE8ではなく、私が試した他のすべてのブラウザで見栄え）、テキストはタブに中央揃えされません。これを正しく修正するにはどうすればいいですか？

Answer 1

あなたは単語のdivの左下は、パネルの左上に並んされていることを確認する必要があります。 http://jsfiddle.net/8gU8z/4/を参照してくださいdivの高さに等しいtop: -15pxを追加しました。

IEをターゲットにしてこれを "逆"にするには、http://jsfiddle.net/8gU8z/9/のような条件付きのコメント付きCSSを使用します。IEスタイルシート（もしあれば）でもそうです。

Answer 2

この電子

K
私はあなたが回転や
L
について話しているかどうかを理解するために、そのハード？とにかく

..あなたは、IEが動作すると回転の話ならば、あなたはそれが90度も

p.sometext { 
    writing-mode:tb-rl; 
    -webkit-transform:rotate(90deg); 
    -moz-transform:rotate(90deg); 
    -o-transform: rotate(90deg); 
    white-space:nowrap; 
    display:block; 
} 

を回転させるためにあなたのCSSに、この
を追加することができます。..ここでこれについていくつかの素晴らしい資源がありましたので、件名：

• Css Vertical Text
• Vertical Text Css 3
• Vertical Letter by Letter

希望はこのことができます:)