【问题标题】:What is causing white space in my mobile site?是什么导致我的移动网站出现空白?
【发布时间】:2014-07-13 19:17:43
【问题描述】:

我正在创建一个响应式网站。它正在正确调整大小,但我注意到,当突出显示页面上的文本时,就好像我要将其复制到剪贴板一样,它会滚动到右侧显示空白区域。

没有滚动条,因为我在样式表中实现了 html{overflow-x:hidden},所以这与我在网络上看到的其他情况不同。这只发生在小于 1024 像素的尺寸上。

我已经设置了媒体查询大小,设置了相应的样式,并再次隐藏了任何溢出。

这个网站现在没有上线,我的客户试图保持隐私,所以我的双手被束缚在我可以分享多少内容上。

我可能遗漏了哪些可能导致出现此空白的内容?

【问题讨论】:

  • 在没有看到任何代码的情况下无法确定。您可能可以通过使用 firebug 检查页面来找出原因。然后隐藏每个元素,直到多余的空间消失,这样你就知道是什么原因造成的。从最大的块开始隐藏,然后向下钻取
  • 您先生是个天才。我很尴尬,我从来没有想过试错。我没有意识到,在我的样式表中,一些元素具有不同的宽度或填充,我猜这是我尝试并忘记更正它的结果。

标签: mobile responsive-design


【解决方案1】:

把这个放到<head>

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no" />

【讨论】:

    【解决方案2】:

    确保您的边距和填充没有溢出并且没有设置为 100%。 您可以使用 chrome 检查器或其他工具进行调试。

    【讨论】:

      猜你喜欢
      • 2014-09-06
      • 2023-02-17
      • 1970-01-01
      • 1970-01-01
      • 2022-10-18
      • 1970-01-01
      • 2015-05-03
      • 2017-08-09
      • 2015-03-02
      相关资源
      最近更新 更多