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 trialEvaldas Burlingis
1,079 PointsHeader is not on the top of the page
Hello,
I have a struggle with header. Before header there is white line, so my header color comes right after it. Im trying to fix it, but just can't do it.
heres my code of header
header { float: left; margin: 0 0 30px 0; padding: 5px 0 0 0; width: 100%; }
logo {
text-align: center; margin: 0; }
3 Answers
Andreas cormack
Python Web Development Techdegree Graduate 33,011 PointsIf i understand correctly there is a gap between the top of the page and the start of your header?? if that is what it is try this. Try setting a margin 0 and padding 0 before you add any styling to the header like this.
header { margin:0;padding:0;float: left; margin: 0 0 30px 0; padding: 5px 0 0 0; width: 100%; }
try that .
or try negative margin to the top. header {float: left; margin: -20px 0 30px 0; padding: 5px 0 0 0; width: 100%; }
Evaldas Burlingis
1,079 PointsNegative margin worked, thank you
Maksim Kazlouski
8,986 PointsHi, Evaldas.
I faced your problem with empty space at the top of page.
What i find out that in mine project there were pictures, like Nick had in his portfolio gallery, that were pushing somehow content away from the top. Try commenting different blocks of html code to find out what code causing problems.
UPD: i found problem in my case. When i'm assigning css rule for mine <ul> in navigation to <section> tag instead of <ul> it pushes all page away from the top in browser.
<div id="wrapper"> <section> <!--NO id="gal" HERE--> <ul id="gal"> <li> <img src="img/html5-logo.png"> ...