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 trialChristian Erickson
13,894 PointsNo margin between profile pic and navigation
Can't find an answer for this on the forum but for some reason the margin is not showing up between the profile pic and the navigation no matter what I try. I'm using safari. The code is exactly what Nick does in the video, I'm even using the pic provided, and I can't find any errors in my HTML or CSS that would cause this problem.
Any ideas?
Here's my CSS code btw:
.profile-photo {
clear: both;
display: block;
max-width: 150px;
margin: 0 auto 30px;
border-radius: 100%;
}
5 Answers
Dustin Matlock
33,856 PointsIt looks like you had a semicolon after your margin
property instead of a colon. If you replace the semicolon with a colon, it should correct the issue. For future reference, you can post a Pen like this.
header {
float: left;
margin; 0 0 30px 0; /* Replace semicolon with colon */
padding: 5px 0 0 0;
width: 100%;
}
Dustin Matlock
33,856 PointsHi Christian, could you maybe post the full HTML and CSS onto something like CodePen? Or you can post the full contents here if you like.
Christian Erickson
13,894 PointsHere's my HTML: http://codepen.io/anon/pen/ogZapK.html
And my CSS: http://codepen.io/anon/pen/ogZapK.css
Juan Aviles
12,795 PointsWhat browser are you using? I had this problem while using Firefox, and found that Firefox had issues with displaying elements as block. If you are indeed using Firefox, try Chrome for this particular challenge.
Chris Brown
1,923 PointsDustin, Thanks for your code example. I was having the same issue with no space between the profile picture and navigation bar. When I glanced over my CSS a bit more in depth, I found that after each value for the padding and margin I had placed a comma. For some reason I thought that was necessary but it turns out not to be so much. I was trying to add padding to the wrapper element to correct this initially but it was much easier after just removing the stinking commas.
Thanks Again!!
Tyler _
6,651 PointsI'm using Firefox. I have the same problem. The image is up against the nav bar with no padding at all. Is there a fix?
Christian Erickson
13,894 PointsChristian Erickson
13,894 PointsDude! Thanks! Not sure how I missed that!