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？

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

1 个答案: