Question

I have a big problem. Im designing a Landing Page but I have a problem with the footer element!

I set its width on 100% but when i preview it in the browser it’s not 100% but it left a few pixels’ border on the left, on the right and on the bottom.

This is footer’s CSS:

footer {
width: 100%;
background: white;
height: 100px;
margin-top: 100px;

}

anything changes also if I add somethings like: left: 0px; bottom: 0px; or right:0px;

How can I do?

this is an image if I didnt explain the problem very well.

http://tinypic.com/r/zsoh8m/6

Answer 1

It looks like you did not reset the padding and margin values on the body tag. Browser use a standard set of CSS rules there, which oftentimes includes some paddings and margins there.

Add this to your CSS:

body { margin: 0; padding: 0; }