My black box can not be center

Question

Am using flex box
https://code.sololearn.com/WoHys05rAkry/?ref=app

Answer 1

You haven't set the height of the body:
body{
height: 100vh;
}

Answer 2

The point is not flex, but the fact that 100% is calculated from the size of the content of the body, in your case 50 px.
And 100vh is 100% of your screen height.

Answer 3

So flex box does not support 100%

Answer 4

div#loader{
display:none;
text-align: center;
}
p{
color: black ;
border: 5px solid white;
}