div 要素の中のpタグを縦に中央に配置したい

Question

divタグの中にあるpタグを縦方向の真ん中に配置したいです。
align-item： centerをつけましたが縦方向に真ん中にならず、、
どうしたらできるのでしょうか？

          <div class="width-400 height-50">
            <p class="color-white">aaa</p>
          </div>

div,
p,
 {
  &.width-400{
   width: 400px;
  }
  &.height-50{
    height: 50px;
  }
  &.color-white {
    color:#ffffff;
  }

Answer 1

align-item の部分は、align-items のtypoだとして、
align-itemsはFlexboxでのプロパティです。

div {
  background-color: lightgray;
  display: flex;
  align-items: center;
}