css - 絶対位置の画像の水平方向の中央揃え

Question

これは中央に配置されたフィドルですが、の代わりに。を使用した画像position:relativeですposition:absolute。

これは、絶対に配置されているが中央に配置されていない別のフィドルです。

画像の幅は可変であることに注意してください。

画像を中央に配置する必要があるのは、1つをフェードアウトさせ、もう1つを背後でフェードインさせたいためです。

何か案は？ありがとう！

Answer 1

より良い解決策は、CSSのpositionプロパティをまったく使用しないことです。

画像をブロック要素として表示してみて、ブラウザに左右の自動マージンを使用するように指示します。

#imagesContainer img{
    display:block;
    margin:0 auto;
}

概念実証フィドル（画像が実際に中央に配置されていることがわかるように境界線が追加されています）：http： //jsfiddle.net/9nkDS/5/