8

I was developing a page recently, and after finding that everything worked properly noticed that I hadn't added the <!doctype html> tag at the top. Upon adding it, the layout ignored the height.

I stripped it down to the most basic layout to see what was wrong and the problem persists. Is what I'm doing inconsistent with HTML5?

The working source code

What it looks like

2 Answers 2

13

You should add the code to your post or it will get closed. Also, something on codepen or jsfiddle would work better, so that we can actually see the results, rather than pastebin.

Add this to your CSS:

html, body {
  height: 100%;
  min-height: 100%; /* for firefox */
}
3
  • 1
    Thank you! It works as desired. I'll also keep jsfiddle in mind the next time that I post.
    – bezi
    Commented Jun 26, 2013 at 19:12
  • Thank you for this. Old answer but still relevant.
    – user743873
    Commented Feb 14, 2015 at 2:32
  • This answer is still relevant. Thank you @Xarcell for this answer. Commented Jul 29, 2019 at 9:02
2

You have to set the height of your tag

body, html {
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
}

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.