如何使用CSS轻松将HTML元素集中在页面上？

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

不是真的 - 您可以从页面顶部声明偏移量，但请稍等一下......网页有多高？垂直居中意味着什么？

您想要相对于打开的浏览器窗口高度居中吗？或者相对于页面的高度居中（页眉顶部到页脚底部，无论浏览器窗口大小如何）。

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