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

CSS

Posted by Emily Larcher
Emily Larcher
220 Points

Header not at the top of my page?

How do I get the header to touch the top of my page, then the nav segment to touch the header segment? Thank you!

/****************** Genereal *******************/ a { text-decoration:none }

wrapper {

max-width: 940px; margin: 0 auto; padding: 0 5%; }

logo{

text-align:center; margin: 0; }

h1{ text-align:center;
font-family: 'Philosopher', sans-serif; margin: 15px 0; font-size: 1.75em; font-weight: normal; line-height: 0.8em; } h2{ text-align:center;
font-family: 'Montserrat Alternates', sans-serif;align-content; margin: -5px 0 0; font-size: 1.50em; font-weight: normal;
} section{ font-family: 'Vollkorn', serif; Margin: 8px 0; font-size: 1.25em; } nav{ text-align: center; padding: 10px 0; margin: 20px 0 0; padding-right:53px; }

section{ text-align: center; padding 10px; } footer{ font-family: 'Cinzel' Margin: 5px 0; font size: .75em; text-align: center; padding-top: 50px; } /heading/ /* color header*/ header { background: #3ab73b; border-color: #299a12; } h1, h2 { color: #fff; } /* nav background on mobile devices*/ nav { background: #599a68; } nav a, nav a:visited{ color: #fff; }

nav a.selected, nav a:hover{ color: #f5f5dc; } section { background-color:#00ff00; color #000000; } /* footer color, and description color*/ body { background-color: #fff; color:#999; }

1 Answer

idan ben yair
idan ben yair
10,288 Points
idan ben yair
idan ben yair
10,288 Points

Hi Emily,

I did not see your html code but make sure your h1 tag is indeed at the top of the page on the HTML side. as to the css, you can try to do this:

h1 {
  margin: 0 auto;
  padding: 0 auto;
}

that will clear the automatic css paddings and margins that are applied to the code. Sometimes there are automatic paddings and margins that are pushing are elements up or down and we dont realize why they are not sticking to the top or not fitting inside certain sections.

Let me know if that works :)