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 How to Make a Website Adding Pages to a Website Style New Pages

No 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

It 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%;
}

Dude! Thanks! Not sure how I missed that!

Hi 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.

Juan Aviles
Juan Aviles
12,795 Points

What 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
Chris Brown
1,923 Points

Dustin, 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 _
Tyler _
6,651 Points

I'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?