1

これは私が開発しようとしているページです。タブ内のテキストと吹き出し内のムービーを中央に配置したい。私が見つけたものはどれも適切に機能しません。このページのすべてはposition: absolute、バブル内の実際のコンテンツを除いて、パーセンテージで定義されています。

index.css

#movie {
    margin-top: auto;
    margin-bottom: auto;
    display: table-cell;
    vertical-align: middle;
    ...
}
#movie-bubble {
    vertical-align: middle;
    text-align: center;
    display: table;
}

root.css

.tab {
    vertical-align: middle;
    text-align: center;
    margin: auto;
}

私は何を間違っていますか？

編集: と言っている人々display: table-cellに &c: これは機能しません。

4

3 に答える 3

2

それが入っているdivを設定する必要がありますdisplay: table;

中央に配置しようとしているテキスト:

display: table-cell;
vertical-align: middle;
于 2012-12-01T18:05:12.563 に答える
0

内でコンテンツを中央に配置するdivには、次の手順を実行します。

外へdiv：

display: table;

内側へdiv：

display: table-cell;
vertical-align: middle;
于 2012-12-01T18:05:01.640 に答える
0

このようなことを試してください:-

 .area { 
 width: 300px; 
 height: 300px; 
background: url(../images/abe-bg.png) no-repeat; 
position: relative;
}

 .bubble { 
 position: absolute; 
 left: 93px; 
 top: 21px; 
  width: 135px; 
height: 84px; 
 display: table; 
}

.bubble p {
display: table-cell; 
vertical-align: middle; 
 text-align: center; 
}

これをチェックしてください： - http://www.vanseodesign.com/css/vertical-centering/

于 2012-12-01T18:06:46.397 に答える