Why this p can't align vertical

Question

https://code.sololearn.com/WuGqYuNo7kE1/?ref=app

Answer 1

You have done the Alignment within a paragraph ☺️
If you want to set the paragraph itself to the center, then you need to write this in the body and set the height 100vh.
body {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
}
Also you can replace
align-items: center;
on
vertical-align: middle;
which will be more informative for your case. ☺️
body {
display: flex;
flex-direction: column;
vertical-align: middle;
justify-content: center;
height:100vh;
}

Answer 2

Set body to full height is not enough to make this p to align vertically center.

You have to set html, body and p to full height.

html,
body,
p {
height: 100%;
}

Answer 3

I have already given you the answer.

Answer 4

Kode Krasher thanks

Answer 5

When u want to align a flexible content to the center vertically just make sure that it occupies the whole body..

Answer 6

Vasiliy how to do that