divを親divに対して真ん中に配置する

harada 289views 更新:2014年4月23日

子divを親divの真ん中に配置するためのCSSです。

HTML

<div class="wrap">  
    <div class="inner">コンテンツ</div>
</div>

CSS

.wrap {
    width: 100%;
}
.inner {
    width: 50%;
    margin: 0 auto;
}

またIE8以上でしたら以下のようにすることでも真ん中に配置できます。

.wrap {
    width: 100%;
}
.inner {
    display: table;
    margin: 0 auto;
}

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません