☰

大きなdiv内で画像を中央（垂直と水平）に配置する方法 [重複] 質問する

tag-icon • tag-icon html css
大きなdiv内で画像を中央（垂直と水平）に配置する方法 [重複] 質問する

200 x 200 ピクセルの div があります。50 x 50 ピクセルの画像を div の真ん中に配置したいです。

どうすればそれができるのでしょうか?

div を使用することで、水平方向に中央揃えにすることができますtext-align: center。ただし、垂直方向の配置が問題です。

ベストアンサー1

古いブラウザで動作 (IE >= 8)

絶対位置と自動マージンを組み合わせることで、要素を水平方向と垂直方向に中央に配置できます。要素の位置は、相対配置を使用して親要素の位置に基づくことができます。結果を見る

img {
    position: absolute;
    margin: auto;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

おすすめ記事