如何轻松地将CSS元素置于页面上使用CSS？

Question

我有一个表单，我希望直接位于页面中间。我有这个CSS

#form { 
     width: 240px; 
     height: 100px 
     margin: 0 auto; 
     display: block; 
     } 

这只能做到水平。有没有办法做到垂直？

Answer 1

我可能是错的，但如果我没有记错..这应该工作：

#form { 
    width: 240px; 
    height: 100px 
    position: absolute; /* make sure this is wrapped by an element with "position: relative" */ 
    top: 50%; 
    left: 50%; 
    margin: -50px 0 0 -120px; /* half of the height and width */ 
    } 

如果我错了，那么你可能不得不使用JavaScript。

Answer 2

不是真的 - 您可以声明页面顶部的偏移量，但想一想......网页有多高？垂直居中是什么意思？

你想相对于打开的浏览器窗口高度居中吗？或者相对于页面的高度居中（页眉顶部到页脚底部，而不管浏览器窗口大小）。

在预览中，原帖中的评论涵盖了这一点。