如何在页面中央保留div？

Question

我正在使用jQuery创建一个"对话框",它应该弹出页面顶部和页面中心(垂直和水平).我应该如何让它保持在页面的中心(即使用户调整大小或滚动？)

Answer 1

我会用

position: fixed;
top: 50%;
left: 50%;
margin-left: -(dialogwidth/2);
margin-top: -(dialogheight/2);

但是使用此解决方案并且浏览器视口大小小于对话框,对话框的部分将无法在顶部和左侧访问,因为它们位于视口之外.所以你必须决定它是否适合你的对话框大小.

(CSS现在还不知道如何计算.所以那里的小数学必须由你完成.因此你的对话必须是一个你必须知道的固定大小.)

编辑:

哦,是的,如果你也想为IE6提供对话框,你应该这样做:

#dialog { position: absolute; }
#dialog[id] { position: fixed; }

由于IE6不具备固定位置且不具备属性选择器,因此IE6将是唯一将位置设置为绝对位置的人.(这只会影响滚动行为.绝对停留在页面中的位置,并固定在浏览器中的位置.其余部分类似.)