css - 使用 CSS 垂直居中 div

标签 css

我目前在一个 wordpress 网站上工作,我想在其中使用 CSS 将我的页面换行居中。我尝试在此站点上实现方法 3,但没有成功。

网站:http://blog.themeforest.net/tutorials/vertical-centering-with-css/

我使用了两种不同的 div,一种的 ID 为 floater,另一种的 ID 为 page-wrap。我的 CSS 看起来像这样

#floater { float: left; height: 50%; margin-bottom: -481px; }

#page-wrap { clear: both; color: white; width: 1594px; height: 962px; margin: auto; position: relative; }

我还想指出,在我的 page-wrap div 中,如果这会以任何方式影响结果,我还有很多其他 div 来构建我的设计(它们也会向左和向右浮动)。

JSFiddle 链接:http://jsfiddle.net/FERNX/

最佳答案

尝试

#floater{
    margin-top: 25%;
}

position: absolute;
    top: 50%;
margin-top: -25%;

关于css - 使用 CSS 垂直居中 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9049836/

相关文章:

css - 是否可以在 Web 应用程序中仅提取和捆绑必要的 css 类

html - 我的输入字段在 IE 上以内联方式呈现,但在 Chrome 和 Firefox 中以新行呈现。我该如何解决?

html - tumblr 中标签的搜索框结果

javascript - 使用 css 或 javascript 根据用户操作更改 html 页面上的图标

html - Chrome 中的 CSS3 过渡故障

CSS :not selector doesn't work

javascript - 如何将 jquery 与我的 Node.js EJS 模板一起使用?

css - 使用纵横比背景图像将图像居中放置在 div 中

javascript - 在默认 PDF 查看器的 iframe 中禁用/隐藏下载按钮

html - 如何删除正文和页脚之间的空白间隙?