How to Center Single Line and Multiple Line Text

  css3, question

As shown in the figure,图片描述

When there is only one line in the line, the text is vertically centered. When there are two lines of text, the text is also vertically centered. How can this be done?

PS: no flex.

Look at the effect diagram first.
图片描述
Then there is the code implementation

<style>
 .message-box{
 width: 500px;
 height: 500px;
 background: #333;
 }
 .message-item{
 background: #666;
 padding: 20px;
 width: 100%;
 height: 100px;
 display: table;
 box-sizing: border-box;
 }
 .item-title{
 width: 60%;
 margin: 0;
 display: table-cell;
 vertical-align: middle;
 }
 .item-time{
 width: 40%;
 margin: 0;
 display: table-cell;
 vertical-align: middle;
 text-align: right;
 }
 </style>
 <div class="message-box">
 <div class="message-item">
 < p class="item-title "> course order successfully < /p >
 <p class="item-time">2017-02-01 10:30</p>
 </div>
 <div class="message-item">
 < p class="item-title "> the activity you signed up for is about to start < /p > [portfolio day-let's see the exhibition] </p >
 <p class="item-time">2017-02-01 10:30</p>
 </div>
 </div>