Dakota
Dakota

Reputation: 42

Why am I managing to set the size of divs in percent?

Guys I'm already getting slightly annoyed, I'm not able to find out why I'm managing to set the height of the divs in percentage, because I saw it on a website just to confirm that setting the height of the divs in percentage does not work, unless it is div be a child div, so why the hell can I set the height of the elements in percent even when the div doesn't have a parent div?
Well, my body code in css looks like this:

html,body{                                      
 width:100%;                                     
 height:100%;                                    
 font-family:Verdana;
 color:#fff;                                     
 backgroundd:#151515;                             
}

Could anyone explain why this is happening? Why I’m very curious to know why percentage height works when it shouldn’t, this shouldn’t happen right?

Upvotes: 0

Views: 45

Answers (1)

Nora
Nora

Reputation: 650

If the parent element... body has a width and height of 100% (being the browser frame, should the html element have a width and height of 100%), then of course any children of the body element is going to be relative to that.

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

body {
  margin: 0;
}

.container {
  height: 50%;
  width: 50%;
  
  background: black;
}
<body>
  <div class="container">test</div>
</body>

This is exactly what should be happening.

Upvotes: 1

Related Questions