Html CSS图像宽度100%，但仍有一些背景_Html_Css

Html CSS图像宽度100%，但仍有一些背景

html css

Html CSS图像宽度100%，但仍有一些背景,html,css,Html,Css,我有以下网站：它在桌面上工作正常，但由于某种原因，在移动设备的浏览器上，它的侧面有一个灰色的条我有以下代码： css body { background-color: #4B5961; width: 100%; margin: 0; } .top-container { float: left; width: 100%; background: linear-gradient( rgba(0,0,0,0.1), rgba(0, 0, 0,

我有以下网站：

它在桌面上工作正常，但由于某种原因，在移动设备的浏览器上，它的侧面有一个灰色的条

我有以下代码：

css

body {
    background-color: #4B5961;
    width: 100%;
    margin: 0;
}

.top-container {
    float: left;
    width: 100%;
    background: linear-gradient( rgba(0,0,0,0.1), rgba(0, 0, 0, 0.1) ),url('../images/background1.jpg') no-repeat center center fixed; 
       -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
  }

html

<body>

    <div id="image-head" class="top-container">

侧面下方的灰线与车身的背景色相同（

#4B5961

）

如您所见，我将主体宽度和背景图像宽度都设置为

100%

。所以我不希望看到灰线。我认为这是滚动条的结果

如果有人能告诉我如何删除这个，我将非常感谢你的帮助。

检查你的样式这个css规则，去掉左边的

填充：10px：
.wz-title {
    color: #B2D137;
    font-weight: bold;
    /* padding-left: 10px; */
    font-size: 110%;
    text-shadow: 0px 0px 10px rgba(0,0,0,0.7), 0px 0px 1px rgba(0,0,0,0.4);
}

删除带有.wz title
的填充。出于某种原因，删除填充可以修复它
.wz标题{
左侧填充：0；
}

在这里：
设置溢出-x：隐藏；在你的身体上，这将修复它：
body {
overflow-x:hidden;
}

试试这个：
body, body * {
    box-sizing: border-box;
}

通过使用上述代码，您将永远不会遇到任何填充问题。
 伙计，那是滚动条，对吗？哦，等等，不。我想这是滚动条的结果，但不是滚动条。滚动时，滚动条悬停在此上方，不滚动时消失。删除带有.wz title
的填充。嗨，丹尼尔，谢谢！我的错，我感谢你的帮助，这就是问题所在。我会尽快把这个标记为答案。嗨，普拉文，谢谢你，这就是原因。下面的丹尼尔也发现了我的错误。