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.

HTML

Whitespace above header?

Hello! I can realise there's a whitespace above the paragraph element. I know that "margin-top: 0;" fixes it, but I want to use <li> and for it to start at the very top of the browser like a little fixed navigation bar.

2 Answers

Damien Watson
Damien Watson
27,419 Points

Hi Dean,

The body also has a default margin and back in the day padding. The unordered list comes with its own margin and padding as well, so to be safe you'd strip them all and then add back as needed. Probably something like this should get you on the right track:

body {
  margin:0;
  padding:0
}
ul {
  margin:0;
  padding:0;
  list-style:none;
}
li {
  display:inline-block;
  padding:10px;
}

Hello, Damien, thanks for replying. I've tried your code but the list items continue to stay a space below the top html. If I try a paragraph or h2 element, I am able to reset the margin and padding, however, list items are not working.

Damien Watson
Damien Watson
27,419 Points

Hi Dean, sorry for the delay in replying. Are you able to provide any html/css that you are using? The code above should do the trick, if not it might be something with your layout or other elements.