水平垂直居中 - absolute

by redky

HTML

<div class="parent">
    <div class="sub"></div>
</div>

CSS

.parent {
    width:100%;
    height: 100px;
    position:relative;
    background-color: #f66;
    margin: 100px 0 0 0;
}
.sub {
    width: 20%;
    height: 120px; /* 高度可调节. 可大于 父节点 */
    background-color: #f33;
    position:absolute;
    margin: auto;
    left: 0; right: 0;bottom: 0; top: 0;
}