position: fixed caused element to be wider than browser

Question

Can anyone tell me why position:fixed cause the element to be wider than the browser or other content on the page and causing horizontal scrolling?

Here is the code HTML

Answer 1

By default the body tag have margin.
Try this in your stylesheet:

body{
  margin: 0;
}