2012-01-22 16 views
0

可能性の重複:どのように
Horizontally and vertically center a pre tag without the use of tables?相対テキストセンタリング。垂直方向と水平方向

幅を指定せずにI水平方向と垂直方向の中央テキストのですか?

今私が持っている:

<div class="center"> 
<p id="logo"><span>Coming soon!</span></p> 
</div> 

とCSSは次のとおりです。

span { 
    color:#ff0000; 
    font-size: 14px; 
    font-weight:normal; 
    font-family:sans-serif; 
    border-bottom-color: currentColor; 
    border-bottom-style: dotted; 
    border-bottom-width: 1px; 
    line-height: 1.1; 
} 
.center { 
    width:150px; 
    height:100px; 
    position:absolute; 
    left:50%; 
    top:50%; 
    margin-left:-100px; 
    margin-top:-50px; 
} 

テキストは、異なる幅になるので、私は別のソリューションを必要としています。これはテキストのみの単一行のために働くことを

text-align:center; 
line-height: 100px; 

注:

答えて

1

は、あなたのセンタークラスに以下のCSSを与えます。たとえば、jsFiddleを参照してください。

関連する問題