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

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.