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 trialAlec Chan
172 PointsUnnecessary white space about main header title
Basically, going through the CSS course: Build Navigation with Unordered Lists section; video, it teaches you how to fix the white space at the very top of the page with the code:
/*******************
HEADING
*******************/
header {
float: left;
margin: 0 0 30px 0;
padding: 5px 0 0 0;
width: 100%;
}
This works for pages: Home and about except for the contacts page which is interesting... Does anybody know a fix?
I will appreciate any answer!
Thanks!
2 Answers
Jake Rorrer
17,788 PointsDo you have any other css code on your contacts page? Css stands for cascading style sheets because that is basically how it works. Code towards the bottom of your css will take precedence over code towards the top because of the "cascading" aspect of css. It also takes into account specificity, so a more specific selector like... header li { }... would take precedence over something less specific like just... header { }
As for your padding and margin the four values correspond to top, right, bottom and left respectively. So you have 30px margin on the bottom of your header and 5px of padding on top. If you were to change the padding of your header anywhere else on the page for example something like this:
header li {
padding: 0;
}
That would remove the padding from all your header's list items.
Mike Fondario
11,286 PointsGreat answer.
CJ Jugarap
2,517 PointsI had a similar issue and tried a few different solutions such as setting -15px and -20px to the top of the margin, but I realized that the problem was that I had a few errors throughout my code such as double :: after some of my properties and forgetting ; after some of my values. Once I 'cleaned' up my code the white space was gone.
Mike Fondario
11,286 PointsMike Fondario
11,286 PointsThe only thing I can think of is to play around with the padding and see how it affects the other pages.