已知宽高和未知宽高的div块的水平垂直居中

//已知宽高的情况
.div1_container{
    border:1px solid #00ee00;
    height:300px;
    position:relative;
}
.div1_center{
    position:absolute;
    top:50%;
    left:50%;
    margin:-100px 0 0 -100px;
    200px;
    height:200px;
    border:1px solid red;
}
//未知宽高的情况
.div2_container{
    text-align:center;
    height:400px;
    border:1px solid #0000ed;
}
.div2_container:before{
    content:'';
    height:100%;
    display:inline-block;
    vertical-align:middle;
}
.div2_center{
    display:inline-block;
    vertical-align:center;
    border:1px solid red;
}
原文地址:https://www.cnblogs.com/xhliang/p/7462926.html