本文介绍了如何为居中的浮动确认对话框设计 CSS?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！
问题描述
我正在寻找一种方法来显示始终位于页面中心并浮动在页面上的确认对话框.
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;
}
有什么想法吗?谢谢
推荐答案
试试这个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应该是对话框的容器div
#centerpoint should be the container div of the dialog
注意 #centerpoint DIV 应该在 body 元素内或在没有 的元素内>位置:相对；属性
Note that the #centerpoint DIV should be inside the body element or inside elements that don't have a position: relative; property
这篇关于如何为居中的浮动确认对话框设计 CSS?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！