Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

Oliver Fajardo
Oliver Fajardo
2,853 Points

White gap on top of page

Hello Treehouse Community,

I am having trouble with the web design track where we are asked to replicate the website Nick is building in the tutorials.

I have spent hours trying to resolve this issue of the white gap on top of the page but don't know whats wrong. I think their is something overwriting the css but do not know what is.

Heres my problem in a gist.

The Portfolio Page does not have the white border in the expanded desktop version nor in the minimized/mobile layout, which is what I want

**The About page has the white gap on top of the page on both layouts.

**The Contact page has the white gap only in the minimized/mobile layout.

If someone could please read over my code that would be great! I can send over the files through email or some other means of communication (I've noticed posting bits and bits of code here does take quite a while to review, so, I'd rather just send the whole file).

Thank you,

Oliver

Adam Moore
Adam Moore
21,956 Points

You might be able to put your code on CodePen and then post the link, so it'll be fairly easy to work with your code to try to figure out what is happening.

Oliver Fajardo
Oliver Fajardo
2,853 Points

Thank you for your quick reply.

Is there a way to post multiple html/css pages on CodePen?

Adam Moore
Adam Moore
21,956 Points

In different CodePen pages, I know you can. As far as multiple ones on each page, I'm not sure. I'm guessing that the issue that you are having with the white space might be the same issue for both html pages that you have, though. I may be wrong, but the way you are describing it, it sounds as if the issue might be caused by the same type of styling.

3 Answers

Lucas Santos
Lucas Santos
19,315 Points

Sounds to me like extra Margin or Padding somewhere.

Oliver Fajardo
Oliver Fajardo
2,853 Points

I asked my brother who did this track quite some time ago to let me compare his code with my code. Being that it is the same project, I could not find a difference in the content of the code (besides the personal information). I went over the code very closely, around 5 times, and later arrived to a conclusion. The editor I'm currently using, Brackets, has been glitching a lot lately, sometimes not displaying the elements correctly, and whenever I updated the file/code, there was always something off. So I decided to delete it and reinstall it. Everything seemed to work fine after that! It was frustrating but at least I found the solution! Thank you for your input guys! #editorproblems

Lucas Santos
Lucas Santos
19,315 Points

I see well good to hear. And just a tip you should really use "Sublime Text 2" (Text Editor). I used to use something called TextWrangler until I found out about this sublime text editor which was really helpful.

Oliver Fajardo
Oliver Fajardo
2,853 Points

Thanks, I will probably go back to sublime text since I find it a bit more reliable.

I like brackets because it has a live preview window, and when you hover over code it inspects the elements and highlights them so its easier to know what you're making changes too. I'll use this once in a few updates!

(You should look into Atom Editor as well, it's looks like it's going to be one of the best editors in the near future now that it's fully open source and has so many contributors!)