垂直居中

例如:

&:after{

           position: relative;

            display: inline-block;

            content: "";

            height: 100%;

            vertical-align: middle;

}

 .action-container{

            position: relative;

            display: inline-block;

            vertical-align: middle;

            80%;

            height: 150px;

            left: 50%;

            margin-left: -40%;

            overflow: hidden;

}

 

注:

1.vertical--align同级元素不可绝对定位,否则会失效

2.垂直居中和两端对齐的伪类不可在同级使用,可以在外面套一层div,对div内元素两端对齐,对div在大容器中垂直居中

原文地址:https://www.cnblogs.com/zhengh/p/4819360.html