如何利用伪类元素和vertical-align: middle;实现元素相对于父元素居中
HTML部分
<div class="zhihu"> <div class="loginMain"> </div> </div>
css部分
.zhihu { height:100%; min-width:720px; text-align: center; vertical-align: middle; } .zhihu:before{ content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -.25em; } .loginMain { display: inline-block; width:300px; height:590px; margin:auto; background-color: #1b6d85; vertical-align: middle; }
要点:元素必须都为inline-block;