0

だから私は2つのdiv-containersを取得しようとしていますが、どちらも中央揃えのテキスト（x軸とy軸の両方）を含む必要があります。

Googleとstackoverflowのおかげで、vertical-alignなどで遊ぶいくつかの回避策に出くわしました。しかし、何も機能していないようです。

#right-menu {
    position: absolute ;
    right: 0% ;
    top: 0% ;
    height: 100% ;
    width: 5% ;
    text-align:  center ;
    background: #ededed ;
        display: table-cell;

vertical-align: middle ;

ここにフィドルがあります：

http://jsfiddle.net/7Rgvs/

4

3 に答える 3

1

基本的に、最初に親要素をCSSからテーブルとして定義する必要があり、次にその子要素をテーブルセルとして表示できます。

例えば、

 div.parent {
    display: table;
 }
 div.parent div.child {
    display: table-cell; 
     vertical-align: middle;  
}

このリンクをチェックしてください、それはあなたの質問を明確にするでしょう.. http://css-tricks.com/vertically-center-multi-lined-text/

于 2012-06-15T10:03:43.813 に答える
1

Vertical-align:middlevertical-align:middle を使用している場合、プロパティは使用されませんposition:absolute;。このレイアウトを変更してみてください http://jsfiddle.net/7Rgvs/5/

于 2012-06-15T10:16:34.720 に答える
0

(holder #left-menu 要素) には display: table を使用し、内側の holder 要素には display: table-cell を使用し、次のスタイルを使用します。

#left-menu .inner {
    display: table-cell;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
    width: 100%;
}

私はあなたのフィドル内の左のメニューを編集しました: http://jsfiddle.net/7Rgvs/

于 2012-06-15T10:11:04.987 に答える