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

Posted by Sagar Patel
Sagar Patel
3,653 Points

How to make float element start at top of page

The first element that I make float doesn't start at the very top of the page, but instead like 20px below the very top. I tried setting the margin and padding to 0, but it still didn't work.

2 Answers

Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Did you set the margin and padding to 0 on the body element?

Does the element that you're floating have a top margin?

Dustin Matlock
Dustin Matlock
33,856 Points
Dustin Matlock
Dustin Matlock
33,856 Points

Code examples would be helpful.

Sagar Patel
Sagar Patel
3,653 Points

Here is the code 

<!DOCTYPE html>
<html>
<head>
<title> Test</title>
<style>
body {
    background-color:#420600;
}
h1{
    position:float;
        float:right;
    color:black;
}
</style>
</head>
<body>
<h1>Testing for float</h1>
</body>
</html>
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Here's some tips on how to post code in the forum:
https://teamtreehouse.com/forum/posting-code-to-the-forum

Try fixing your code block.

Also, float is not a valid value for the position property. Not sure what you're trying to do with that.

I also don't see in your code where you've set the margin and padding to 0

Dustin Matlock
Dustin Matlock
33,856 Points

Try this:

body {
  background-color: #420600;
  margin: 0;
  padding: 0;
}
h1 {
  float: right;
  color: black;
  margin: 0;
  padding: 0;
}
p {
  margin: 0;
  padding: 0;
}