White gap at top

#1

I have a large gap of white space at the top of my paige. here is the code I wrote

.main {
background-image: url("https://s3.amazonaws.com/codecademy-content/projects/move/bg.jpg");
height:600px;
color:white;
background-repeat:no-repeat;
background-size:cover;
}

#2

Use "margin: -7.5em 0em 0em 0em;" in your .main { }

#3

sry, but could you please elaborate a bit? why is there a white gap there? Thank you :smile:

#4

Same here. I guess it's just a bug only because if we use margin with a negative value, there will be a distance between the word Move and the top of the page. Unless you modify the height of the

as well.

Any news?

Thanks! =)

#5

The solution is to use margin with minus degree. It is either a bug caused by the browser inside the browser mode or it is a wise move from CC to make us learn

#6

I had the same problem.
When I added margin:0px to the mainh1, the white gap on top disappeared.

.main h1 {
  font-size: 150px;
  color:#fff;
  margin:0px; 
}

I don't why it did work though..

#7

Right I been wondering that the last two projects, I tried and it worked, but the code doesn't make any reason why margin: 0px; works for the h1...

#8

I had the same problem I read a few pages and tried some different things and this is one of the things that worked out of the ones I tested.
Some helpful words here