我在寻找一种方式来显示总是围绕在页面上确认对话框,和浮动在页面上。
试过了,但它不是始终围绕可言,因为其位置是固定的:
.Popup
{
文本对齐:中心;
位置:绝对的;
底部:10%;
左:27%;
的z-index:50;
宽度:400像素;
背景颜色:#FFF6BD;
边界:2px的纯黑色;
}
你知道吗? 谢谢
解决方案尝试使用该 CSS
#centerpoint {
顶部:50%;
左:50%;
位置:绝对的;
}
#对话 {
位置:亲属;
宽度:600px的;
保证金左:-300px;
高度:400像素;
的margin-top:-200px;
}
< DIV ID =中心点>
< DIV ID =对话框中的>< / DIV>
< / DIV>
#centerpoint 应该是对话的div容器
注意的,这一在 #centerpoint DIV应该是体内元素或内部元件不具有的的位置是:相对; 的属性
I'm looking for a way to display a confirm dialog that's always centered on the page, and floating over the page.
Tried that, but it's not 'always centered' at all, since the position is fixed:
.Popup
{
text-align:center;
position: absolute;
bottom: 10%;
left: 27%;
z-index:50;
width: 400px;
background-color: #FFF6BD;
border:2px solid black;
}
Any idea? Thanks
解决方案Try using this CSS
#centerpoint {
top: 50%;
left: 50%;
position: absolute;
}
#dialog {
position: relative;
width: 600px;
margin-left: -300px;
height: 400px;
margin-top: -200px;
}
<div id="centerpoint">
<div id="dialog"></div>
</div>
#centerpoint should be the container div of the dialog
Note that the #centerpoint DIV should be inside the body element or inside elements that don't have a position: relative; property