Div 仅在 iPhone 上具有右边距 [关闭]答案

【问题标题】：Div has right margin only on iphone [closed]Div 仅在 iPhone 上具有右边距 [关闭]
【发布时间】：2012-10-15 18:42:24
【问题描述】：

在 iPhone 上，div masterhead、middleline、middle、bottomline、bottom、colophonline 和 colophon 不会一直到达右侧。但是在桌面上他们可以。我想知道为什么。我试图对 div 应用负边距，但它并没有改变任何事情。不幸的是，我还没有在 iPad 上尝试过。

网站： http://www.domda.se

【问题讨论】：

演示很棒，但是一旦你解决了这个问题，这个问题对其他人来说就毫无用处了。请构建问题，以便它可以继续存在并对其他人有用。即 - 包括相关代码。
您是否尝试过使用视口元标记？
首先，修复您的html validation errors。其次，我在桌面版本的 Safari 中看到一个右边距，无论我制作多宽的窗口，都会导致水平滚动条。解决这个问题，我敢打赌你原来的问题会消失。
padding-right: 10px; 在#colophon 上做什么（在style.css 内）？在我删除它之前，它会导致令人讨厌的水平滚动条。尝试摆脱它。

标签： ios css mobile responsive-design margins

【解决方案1】：

你有几个认真的HTML errors。杂散标签可能会影响您的布局，并且浏览器之间的差异很可能会很明显。

其次，我在桌面版 Safari 中看到了右侧空间（边距还是填充？）。这个空间导致了一个永久的水平滚动条。无论我制作多宽的窗口，一直到 1900+ 像素，滚动条仍然存在。

当我从位于style.css 文件中的#colophon 元素中删除padding-right: 10px; 时，右侧间距问题消失了，烦人的滚动条也消失了。

当我在 iOS 上打开您的网站时，我看到了您的问题，我认为这是由 #colophon 上的右侧填充引起的。

我不确定目的是什么，但我认为您可以安全地删除此padding-right: 10px; 而不会造成任何损害。不过，您需要清除 HTML 验证错误并在所有浏览器中进行测试才能确定。

【讨论】：