Error404 Error404 - 2 years ago 76
HTML Question

HTML tag not covering full content

I want that my

tag covers all the content when it overflows the webpage but if I set
tag to 100% it only covers the 100% of the height and width of my screen.

Example: JSFiddle.

How can I make that the
tag cover always the content?

Thanks in advance!

Dan Dan
Answer Source

Percentage heights are calculated from the height of their parents.

Since the html has no parent height, it get's the viewport height, which is not what you want.

What you actually want to do is omit a height declaration on the html tag, and then your .container height will expand to contain all of its content (since the parent no longer has a height, it can expand as much as it wants).

So simply

html, body{
   width: 100%; // no height declaration

will do the trick.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download