Question

我正在尝试设置应用程序的样式，但由于某些原因，我无法将其中一个类的背景扩展到屏幕的边缘。

我做了一个小提琴来表明这一点：http://jsfiddle.net/Hydropotamus/krevheyc/

我认为这个问题出现在这个课程中：

.moving-background {
    left:-10%;
    padding-top:130px;
    padding-bottom:20px;
    padding-right:20px;
    padding-left:20px;
    width:100%;
    background-color:#00a221;

}

正如你在小提琴中看到的那样，背景颜色并没有延伸到屏幕的边缘，我不确定如何继续前进。

我也试过切换填充和边距，但我无法弄清楚我哪里出错了。

Answer 1

确保正文的边距设置为0.

body {
   margin: 0;
}

Answer 2

在你的CSS中添加：

body { margin:0px; padding:0px; }

不同的浏览器对页面使用不同的边距和填充默认值;最好指定它们。

Answer 3

身体的8px边缘导致了这一点。有些css很糟糕，但你也可以添加margin-left：-8px如果你想改变那个区域而不影响其他区域。

.moving-background {
    margin-left: 8px;
}

另外，顶部绿色部分没有这个间隙的原因是因为位置是固定的并且左边是0％（应该只是0）;

Answer 4

事实证明，该元素位于一个带有一些填充的容器中，我没有注意到。我不得不删除那个填充，然后它能够工作。然而，我确实在小提琴中尝试了你的解决方案，它确实有效，谢谢！

CSS背景颜色未延伸到屏幕边缘

4 个答案: