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 trialHayden Bradfield
1,797 PointsWhy are there margins even though I set margin to 0?
I set the margins to zero, however, when I open to view on the browser, there are spaces between the header, sections, and footer. In addition, there are spaces above the header and on the sides. Do I have to set my margin values into the negatives (example being margin:-12) to get rid of them? What do I do?
Tim Knight
28,888 PointsAs some commenters have noted, you could set everything to a margin of zero. However, I would avoid setting the margin for everything to zero unless you're prepared to manually set it on all of your elements. As David Schriever mentioned, I'd encourage you to post a link to your code so we can help you see exactly what's happening and give you insight into how you could address it in the future.
3 Answers
Aurelian Spodarec
10,801 PointsI tell you why. Because, I guess, you set the margin, maybe to be in the body. The body margin, or html, removes only margins on that.
If you want everything to be seleted you select it with a start.
* {
margin: 0;
}
Headers and such, have a dedfautl margin and or paddings.
Again, I can't see your code so I don't exactly know, but heres my shot.
Hayden Bradfield
1,797 PointsOk I believe I solved the issue earlier today. I had to set the body margin to 0.
But I have two other issues now.
- I aligned the navigation menu to the center, but it offsets to the right slightly
- I cannot get the right passing function to work on Chrome. Although, it works on Edge. I did set a text break so that the text continues on the following line instead of overflowing.
Aurelian Spodarec
10,801 Points: p but you know, we need your code :/ and maybe make a new threat for a new problem? maybe.
Andrew Goninon
14,925 PointsUsing Chrome Developer tools you can highlight the margin at the top of the page. The gap is coming from the h1
element with class name
and can be fixed with:
.name {
margin-top: 0;
}
Andrew Goninon
14,925 PointsJust realised this issue is addressed in the next video!
Eli Simmons
Courses Plus Student 4,148 PointsI think Mr. Bond is probably right
David Schriever
1,777 PointsDavid Schriever
1,777 PointsHey Hayden, could you fork your workspace or show your code?