2012-01-23 28 views
0

私は、人々がインターネットによって引き起こされる脅威をよりよく知るようになるウェブサイトに取り組んでいます。混乱しているテキストアラインメントの問題

私は非常に迷惑なCSSの問題にぶつかっています。この問題は、テキストが水平方向または垂直方向に重ならず、一般的にはCSSを正しく聞いていないようです。私はそれを上書きする何かをチェックして、何もありません。

http://nblackburn.me/pofa/

+0

私はすべてを中心に考えていますか?私は問題 – Eray

+0

を理解することができませんでした唯一のものは、問題を引き起こしていない限り、 "コンテンツ"という名前のメインdivです私は分かりません。 –

+0

固定されました。スパンで、スパンはテキストの幅に過ぎませんでした。 –

答えて

1

スパンは、テキストのサイズのみですので、あなたが働いていないスパン、内のテキストを中心としています。 p要素を使用し、それにtext-align:centerを使用するか、text-align:centerをスパンの親に追加する必要があります。

垂直方向に整列する場合、要素の親をdisplay:table;に、要素をdisplay:table-cell; vertical-align:middle;に設定できます。これにより、要素が垂直に整列されます。 .sopa-box .title

+0

ありがとう、私はそれが何か簡単だったことを知っていた。 –

+0

dsiplay:テーブルは最近のブラウザでのみ動作します。 IE7では動作しません。 –

+0

@MystereMan、Damn、この時点で、私は今までIEのどのバージョンでも動作しないと想定しています。あなたはIE7で働く垂直に整列していることを知っています – mowwwalker

0

display: block;line-height:200pxは、私はあなたのCSSに何を参照してください相続人は水平方向と垂直方向の両方

0

中心に説明する:

.sopa-box .title { 
    font-size: 50px; 
    font-weight: 700; 
    text-shadow: 1px 1px 0px #111111; 
    text-align: center; 
} 

相続人は、それがどうあるべきか:

.title { 
    font-size: 50px; 
    font-weight: 700; 
    text-shadow: 1px 1px 0px #111111; 
    text-align: center; 
} 

その方法あなたは次を使用します:

<div class="sopa-box"> 
    <span class="title">SOPA</span> 
</div> 

問題はありません。

関連する問題