educative.io

Why display:flex is not working with width having percentage values?

Courses
,
#1

why display:flex is not working with width having percentage values?
eg- body {
background-color: #bdf1f6;
box-sizing: border-box;
padding: 0;
margin: 0;
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
This do not center the div vertically. When i make a width: 100vw and height:100vh , the div is then becomes centered horizontally and vertically.Why?

#2

Hi @rishabh_jain,

I’ve tried the width with % in the lesson, and it works fine. Can you kindly provide the complete example or which example you’ve tried in the lesson where the width with % does not work?