为什么我的Divs不会超过100％的宽度？

Question

我有一个非常愚蠢的问题要问。

我正在努力使div跨度为网页宽度的100％，但它无法达到。我希望它是动态的（不指定px中的宽度），我绝对不希望它出现水平滚动条。

我正在尝试制作类似于Stack Overflow的100％页面宽度“提醒”，它会告诉您何时获得新徽章。

我网站的屏幕截图：

粉红色横幅div的代码

<div width='100%' style="padding:0px; background-color:FF0099; background-image:url('pics/pink_bg.png'); ">
  &nbsp;
</div>

Answer 1

您的 html正文标记可能包含填充或边距 css。你应该将它们设置为零（0）。我希望它会有所帮助。

Answer 2

看起来你的身体上有填充物，这阻止了div一直扩展。

Answer 3

在你的css文件中，确保你身上没有任何填充。如果您没有任何东西，可以尝试添加：

body {
    padding: 0;
    margin: 0;
}

Answer 4

只需为正文添加一个css即可删除填充和边距：

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

此外，您只能应用于左，右上和下边距：

body {
padding-top:0px;
padding-right:0px;
padding-bottom: 10px;
padding-left: 0px;
}

Answer 5

其实很容易。确保粉红色横幅div的父容器具有0填充和0边距。在这种情况下，我认为粉红色横幅的容器只是身体标签。现在将以下代码段复制到页面的头部。

<style type="text/css">
    body
    {
        margin:0px;
        padding:0px;
        }
</style>

粉红色横幅的html也不正确。取代

<div width='100%' style="padding:0px; background-color:FF0099; background-image:url('pics/pink_bg.png'); ">

带

<div style="padding:0px; margin:0px; width=100%; height:25px; background-color:#FF0099; background-image:url('pics/pink_bg.png');" >

希望这有帮助

Answer 6

输入

body {
    min-height:100%;
    height:auto;
    margin:0;
    padding:0;
}

在CSS文件的开头。

Answer 7

我遇到了同样的问题，页面右侧有一条很大的白线。我发现以下东西可以挽救生命：

html, body {
  width: 100%;
  padding: 0px;
  margin: 0px;
  overflow-x: hidden;
}

希望这会有所帮助！保重！

Answer 8

我总是输入的每个CSS文档的开头：

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

我从来没有遇到过不需要的外边距或使用该代码填充的问题。