当背景图像应该延伸到页面的整个页面时，在页面右侧显示空白区域
我们的网页背景图片在iOS / iPad / iPhone上的FireFox和Safari中出现问题，页面右侧出现空白。
在其他浏览器上，背景图片可以很好地延伸，但是我们很难在这些浏览器上扩展浏览器的全部长度。
看看我们的FireFox网站 ，看看我的意思。
我补充说：
html,body { width: 100%; height: 100%; margin: 0px; padding: 0px; overflow-x: hidden; } 插入到其他类顶部的CSS中，似乎解决了您的问题。
您的更新的.css文件在这里可用
debugging你的CSS的Ghost CSS元素。
使用这个书签来debugging你的CSS： http : //wernull.com/2013/04/debug-ghost-css-elements-causing-unwanted-scrolling/
在我的情况下，Facebook Like Button引起了这个问题。
在探索了这里提供的一些有用的策略后，我发现我只需要添加iOS特定的CSS（我把它放在我的主要CSS表的底部）。似乎隐藏溢出-x是我的答案。 我认为，如果我的内容广泛，说明宽度为100％会有所帮助。 应该指出的是，我只是在iOS的这个问题。 如果它也在Firefox中，那么应该使用html和body block，因为@media专门针对移动设备。
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5){ html, body{ width:100%; overflow-x:hidden; } }
请髋关节我，如果这似乎不正确的人:)
这是一个相当古老的问题，但我想我会增加我的2美分。 我已经尝试了上述解决scheme，包括ghost css，我一定会保存以备将来使用。 但是这些都没有在我的情况下工作。 以下是我如何解决我的问题。 希望这会帮助别人。
打开检查器（或任何你的喜好），并开始与身体标记的第一个div，添加display: none; 到那个元素。 如果滚动条消失，则知道该元素包含导致问题的元素。 然后，删除第一个CSS规则，并下一层到包含的元素。 将CSS添加到该div，如果滚动条消失，则知道该元素正在导致或包含有问题的元素。 如果添加CSS什么也不做，你知道不是那个引起问题的div，并且容器中的另一个div引起它，或者容器本身引起它。
对于某些人来说，这可能太耗时了。 对我来说幸运的是，我的问题是在标题中，但是我可以想象，如果您的问题在页脚或其他内容中有所说明，则需要花点时间。
问题是在文件中：
style.css – 第721行
#sub_footer { background: url("..http://img.dovov.comexterior/sub_footer.png") repeat-x; background: -moz-linear-gradient(0% 100% 90deg,#102c40, #091925); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#091925), to(#102c40)); -moz-box-shadow: 3px 3px 4px #999999; -webkit-box-shadow: 3px 3px 4px #999999; box-shadow: 3px 3px 4px #999999; padding-top:10px; font-size:9px; min-height:40px; }
删除行：
-moz-box-shadow: 3px 3px 4px #999999; -webkit-box-shadow: 3px 3px 4px #999999; box-shadow: 3px 3px 4px #999999;
这基本上只给了页脚一个阴影渐变。 在Firefox中，这是导致问题的第一行。
overflow-x: hidden; 对我来说是完美的。
我也有同样的问题（ 网站正文背景渲染在iPhone Safari中的一个正确的白色边缘 ），发现添加背景图片到<html>标签解决了这个问题。
之前
body {background:url('images/back.jpg');}
后
html, body {background:url('images/back.jpg');}
显然，（-o-min-device-pixel-ratio：3/2）是造成问题的原因。 在我的testing地点，导致右侧被切断。 我在github上find了一个解决方法。 使用（-o-min-device-pixel-ratio：〜“3/2”）似乎工作正常。
我有同样的问题，所以尝试了一些事情。 其中之一似乎为我工作 – 删除宽度，并添加一个浮动到身体标记。
可能不适用于所有的实例，但在最近的情况下，隐藏内容元素的溢出是不行的…
我只是在iPad上遇到右边的白线，而且只是在水平位置。 我正在使用固定位置的div，背景设置为960px宽，z-index为-999。 由于媒体查询，这个特殊的div只在iPad上显示。 然后将内容放入一个960像素宽的div包装器中。 在这个页面上提供的答案没有帮助我的情况。 要修复白色条纹问题，我将内容包装的宽度更改为958px。 瞧。 水平放置的iPad上不再有白色的右白色条纹。
我看到这个问题已经回答了一个普遍的标准，但是当我看着你的网站时，我注意到还有一个水平的滚动条。 我也注意到这个原因：你已经使用了代码：
.homepageconference .container { padding-left: 12%; }
它与代码一起使用，指出元素的宽度为100％，导致总宽度为屏幕大小的112％的元素。 要解决这个问题，要么删除填充，用相同效果的12％的边距replace填充，要么将元素的宽度（或最大宽度）更改为88％。 这发生在main.css在行343.希望这有助于！
这个问题已经徘徊了一段时间了，但是我找不到的解决方法都是为我工作的（与ipad有相同的问题），但是我pipe理了我自己的解决scheme，这对我想象中的大多数人都适用。
这是我的代码：
html { background: url("..http://img.dovov.comblahblah.jpg") repeat-y; min-width: 100%; background-size: contain; }
请享用！
