与div对齐高度100％
这个问题在这里已经有了答案：
现场演示
我只是让一个jsFiddle向解决方案展示我的建议。 这里我考虑到你需要两个<div>填充每个宽度的50％，100％高度，并且你希望内容在中间垂直对齐。 这是带有源代码的简化工作解决方案。
HTML
<div id="outer">
<div id="table-container">
<div id="table-cell">
This content is vertically centered.
</div>
</div>
</div>
CSS
#outer {
position:absolute;
top:0;
left:0;
width:50%;
height:100%;
}
#table-container {
height:100%;
width:100%;
display:table;
}
#table-cell {
vertical-align:middle;
height:100%;
display:table-cell;
border:1px solid #000;
}
作为参考，我使用了本教程。
position: absolute;
top: 0;
bottom: 0;
会给你一个填充到100％高度的盒子。 确保你的HTML和BODY标签足够大：
html, body {
height: 100%;
}
你想要这种类型的设计吗？ => 例子小提琴
链接地址: http://www.djcxy.com/p/41491.html