Body margin 0 not working

1

Hello world!

I have just started a new pen; I would like my first div to cover the top of the page, just like a navbar;

I have tried setting the body margin to 0 but it does not seem to allow the div to cover the white space between the top of the div and the top border of the page;
I can fix this by setting the div position to be relative and by moving it up 20px,
but I would like to do it by styling the body, I think it may be a smoother way around it.

Ideas?

Thanks!

2

Post your code.

Have you tried padding: 0px for your body?

3

I have!

https://codepen.io/Eddie_Romans/pen/wezyaj?editors=1100

4

The margin is coming from your h1 tag. Do this

h1{
  margin: 0px;  
  text-align:center;
}
1 Like
5

Thanks! Was it taking up space from inside the div? interesting, for some reason my reasoning is that if you take care of the parent element, then everything will be set. I will adjust it right now :slight_smile:

6

Another option is to use overflow: hidden in the #intro div, and leave/set the h1 margin as is

I like this solution better.

#intro{
  background: linear-gradient(to right, #757f9a, #d7dde8);
  letter-spacing:1px;
  text-transform:uppercase;
  overflow: hidden;
}

h1{
  text-align:center;
  margin: 40px;
}
1 Like