JSFiddle - React, Tailwind, and code Playground
by xu xiaofei
HTML
<div class="wraper">
<div>这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的这是一个段落，它应该是垂直居中的</div>
</div>CSS
.wraper{
line-height: 500px;
border:1px solid #000;
width:500px;
height:500px;
background:tomato;
}
div{
line-height:30px;
display:inline-block;
vertical-align:middle;
background:green;
}