Как выравнивать в div по высоте?

https://jsfiddle.net/d2069xyo/1/

<div class='test'>

   <div>

   text

   </div>

</div>

.test{

  display:table-cell;

  width: 300px;

  height: 300px;

  border: 1px solid #000;

  vertical-align: middle;

  text-align: center;

}

Или так: https://jsfiddle.net/ccxtLneu/3/

Olldman, ziliboba0213, спасибо, шлепнуть форум не дает((