+ 1

percentage

why 100% width takes the whole screen while 100% height is only around the content ?

1st Aug 2018, 1:07 AM

Kareem Eladl

2 Answers

+ 1

If you set height:100% on the direct child element of body tag, it means you set height equals to 100% width of the screen. Try to change it to height: 100vh;

1st Aug 2018, 2:35 AM

Calviղ

+ 1

Percentages are related to the parent container element. By default, block elements (among wich are <html> and <body> root containers) get 100% width, but have an auto height behavior (growing with content space need)...

1st Aug 2018, 11:39 AM

visph