在移动连接上从HTML中剥离的空格。为什么以及如何预防

Question

我在移动设备上投放网站时遇到问题，因为从HTML中删除了空格（包括新行）。
这是一个问题，因为它会改变inline-block元素的位置。 （有关该问题的信息，请参阅here）。

最终我采取了一种解决方法（首先摆脱内联块元素之间的空白，然后调整CSS定位），但现在我想弄清楚为什么会发生这种情况。

网站详情：

• 平台：Ruby On Rails 3.2.11（MRI 1.9.3）
• 模板引擎：ERB
• 机架服务器：精简（1.5.0）
• 主持人：Heroku（Cedar）

由于我甚至不确定这是否是rails / rack / heroku相关问题，我创建了一个虚拟副本：

• 将rails生成的HTML复制到静态*.html文件（以及调整后的CSS和JS链接）
• 将该文件上传到另一台计算机（Apache）上，以将其作为静态HTML文件提供

我做了一些测试。嗯...结果（几乎）相同。
如果我用curl发送GET请求，我会得到上面针对这两个网站描述的内容（动态rails应用程序和静态HTML文件）：

• 使用我的固定电话连接我得到了完整的“原始”HTML，包括空格，换行符和缩进。
• 使用我的运营商3G连接（在网络共享中），我得到了剥离每个空白的HTML代码，就像缩小的CSS或JS一样。 （顺便说一下，当我与其他任何网站进行双重检查时，从google.com到xkcd.com也是如此）

YET ，当使用我的手机浏览时，所有内容都会在虚拟静态图像上正常呈现。

老实说，我无法弄清楚问题出在哪里。由于卷曲总是在3G上得到缩小的HTML，我认为问题出在网络上。然而，智能手机仅在Rails提供页面时才会抱怨。

有没有人遇到过这个问题？

Answer 1

我检查了你的博客文章。使用空格格式化布局或使用是错误的方法，永远不可靠。如果你真的必须在html中使用非破坏空格。

 

最好将类放在元素上，然后使用CSS设置边距和填充。事实上你的解决方法是正确的。