Div 宽度 100% 但两侧仍有 space

Question

我试图让我的代码背景有一张高度为 300px，宽度为 100% 的图片，但是当我将宽度设置为 100% 时，它并没有一直显示，有每边之间大约 15px 的区域。我知道我可以将宽度设置为 1000px 之类的东西，但这有很多问题；例如，在某些不同尺寸的显示器上可能看起来不错。我以前问过这样的问题，但它有几个不同的方面。它得到了回答，但我不能用那个解决方案来回答这个问题。

JSfiddle

HTML:

<div id='header'>
  <img src='http://i.imgur.com/tvTMm.jpg' id='headerbg'>
</div>

CSS:

#headerbg {
 background-image:url('http://i.imgur.com/tvTMm.jpg');
  height:300px;
  width:100%;
  background-repeat:none;
  background-size:1340px;
  -webkit-filter: blur(2px);
  -moz-filter: blur(2px);
  -o-filter: blur(2px);
  -ms-filter: blur(2px);
  filter: blur(2px);
}

Answer 1

只需添加此 CSS 即可删除空格

CSS

body,html{
    margin:0;
    padding: 0;

}

DEMO HERE

Answer 2

请检查 fiddle - https://jsfiddle.net/afelixj/g3bwfx6y/ 没有多余的space。

额外的 space 是 body 的默认 margin 吗？

Answer 3

通常是填充，

body, html {
     margin: 0; padding: 0;
}

通常不起作用，因为您 'more specific' 选择的填充的 CSS 将优先。类似于：

menu li {
     padding: 10px;
}

会优先考虑。所以，你应该从它自己的特定行中整理出代码。或者使用“！”重要标记。

body, html {
     margin: 0!; padding: 0!;
}

将优先于：

 menu li {
     padding: 10px;
}

Div 宽度 100% 但两侧仍有 space

Div width 100% but there is still space on the sides

html

css

spacing