不用display:table实现的垂直居中的简单方式

demo.html

<div class="element">
  <p>你好</p>
  <p>你好</p> 
</div>

douchebag-vertical-align.css

/* 基础样式 */
* { margin:0; padding:0;}
html, body { height: 100%; }
body {
  width: 100%;
  height: 100%;
}
/* 关键样式 */
.element {
  text-align: center;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}