Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Posted by Ollie _
Ollie _
5,394 Points

Header Not Going To Top! :(

My header won't go all the way to the top of the page here is my code http://codepen.io/anon/pen/Hrmyb. Can someone give me an explanation why as well so that I know how to fix it in the future?

3 Answers

James Barnett
James Barnett
39,199 Points

The <body> & <h3> elements both have default margin.

But the <h3> isn't at the top of the page, I hear you protest. Since you floated the <header> the <h3> in the first element in your page in normal document flow.

Ollie _
Ollie _
5,394 Points

I'm not sure of what you want me to do? Can you give me instructions? I'm new sorry!

James Barnett
James Barnett
39,199 Points

Add this to your CSS:

body, h3 { margin: 0; }
Ollie _
Ollie _
5,394 Points

Hmmm... I tried that, but nothing happened. It stayed the same.

James Barnett
James Barnett
39,199 Points

Ollie Elmgren - Not sure what issue you are having. Post an updated codepen.

Geert-Jan Hendriks
Geert-Jan Hendriks
23,126 Points
Geert-Jan Hendriks
Geert-Jan Hendriks
23,126 Points

There is standard a padding/ margin in the body. So you can use this in your css:

body{
    padding: 0;
    margin: 0;
}

You'll have to set padding for the other elements

Ollie _
Ollie _
5,394 Points

I'm not sure of what you want me to do? Can you give me instructions? I'm new sorry!

Andrea Sorrell
Andrea Sorrell
4,736 Points
Andrea Sorrell
Andrea Sorrell
4,736 Points

In addition to getting rid of margin in body you have a margin collapsing issue. You are seeing the collapse h1 margin outside of its parent header element. You need to give your element border or padding.