html - 如何在 css+html 中居中模态窗口？

Question

如何使用这种 css 样式使垂直模态窗口居中:

.inquiry_form_container {
  left: 50%;
  margin-left: -375px;
  width: 750px;
  top: 150px;
  position: fixed;
  z-index: 10001;
  background: #fff;
  border: 1px solid #cccccc;
  display: block;
  -webkit-box-shadow: 0 0 10px #cccccc;
  -moz-box-shadow: 0 0 10px #cccccc;
  -o-box-shadow: 0 0 10px #cccccc;
  box-shadow: 0 0 10px #cccccc;
}

它有一个未知的高度，该怎么做才能使该窗口的顶部和底部边距相同？

Answer 1

您可能有使用 left:50% 的正确想法，但我会使用 2 个 DIV。一个在另一个里面:

第一个 DIV 将具有 position:relative、left:50% 和 width:0px。

第二个 DIV(内部)将具有 position:absolute、width:200px 和 left:-100px。

不知道如何处理未知的高度。在第二个 DIV 上设置像素高度并使用 overflow-y:scroll 怎么样？