a tag css putting the text in middle y axis

Question

I used a tag and wrote my content set a background color, height and width.

I used text-align: center; to align the text in the center for x axis.

How can I align it in middle for y axis?

Answer 1

Using flexbox you can specify align-items: center; justify-content: center; to center the text in an element.

p {
  background: red;
  height: 100px;
  width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  }

<p>a tag</p>