103

この例では、画像は中央に配置されていません。なんで？私のブラウザは、IEではなく、Windows 7のGoogle Chrome v10です。

<img src="/img/logo.png" style="margin:0px auto;"/>
4

10 に答える 10

229

追加するdisplay:block;と動作します。画像はデフォルトでインラインです

明確にするために、要素のデフォルトの幅は です。もちろん、これは含まれるblock要素autoの利用可能な幅全体を埋めます。

マージンを に設定するautoと、ブラウザーは残りの半分を に割り当て、残りの半分margin-leftをに割り当てmargin-rightます。

于 2011-04-20T17:24:40.543 に答える
14

一部の状況 (以前のバージョンの IE、Gecko、Webkit など) および継承では、 、 、 、および が設定されていなくても、 の要素が機能しなくposition:relative;なります。margin:0 auto;toprightbottomleft

要素をposition:static;(デフォルト) に設定すると、これらの状況で修正される場合があります。一般に、幅が指定されたブロック レベルの要素は、または配置のmargin:0 auto;使用を尊重します。relativestatic

于 2012-08-21T15:00:33.010 に答える
11

私の場合、問題は、幅自体なしで最小幅と最大幅を設定したことでした。

于 2013-01-31T17:36:44.133 に答える
6

width を追加して を追加しないと、機能しないmargin:autoと思います。私の経験からです。幅は、等しいマージンを提供する必要がある正確な場所を示します。

于 2013-03-28T22:08:35.500 に答える
2

これを使用する代替手段がありmargin-left:auto; margin-right: auto;ます: 要素の左位置を 50% ( ) に設定しますが、要素を正しく中央に配置するには、要素を正しく中央に配置する必要があります。要素を完全に中央揃えにする幅のマイナス半分のマージンmargin:0 auto;position:absolute;
left:50%;

ここに例があります：http://jsfiddle.net/35ERq/3/

于 2014-03-26T01:15:10.797 に答える
0

いつの日か、margin: 0 auto.

私はdisplay: inline-blockそれを持っていましたが、それを削除すると、divが正しく中央に配置されました。

Ross が指摘したように、インライン要素では機能しません。

于 2020-08-26T21:59:04.783 に答える
0

これを本文の css に入れます: background:#3D668F; 次に追加: 表示: ブロック; マージン: 自動; imgのcssに。

于 2019-01-09T03:21:27.343 に答える