CSS:可変のレイアウトに対してabsoluteで真ん中配置を行う

harada 16views 更新:2016年9月8日

HTML例

<div class="popupWrap">
<a href="#">ポップアップを開く</a>
<div class="popupBox">
ポップアップの中身
</div>
</div>

CSS

.popupWrap {
  postion:relative;
}
.popupBox {
  height: auto;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  width: 300px;
}

参考:【CSS】サイズが可変の要素をposition:absoluteで中央配置する方法

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

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

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