iPhone 视口元标记宽度=device-width 无效

iPhone viewport meta tag width=device-width not working

我尝试了所有可能的视口元标记,但似乎没有任何效果。 谁能帮我解决这个问题?

<meta name="viewport" content="width=device-width,initial-scale = 1.0">

网站是 http://sival.dk/。您可以在 chrome iphone 模拟器上 运行。当您加载页面时,您觉得页面适合,但尝试滚动 x 位置,您会看到页面没有完全适合 iphone

更新:感谢 Cory 的回答。我终于发现问题不在于元标记,似乎问题在于页面中涉及的标题。请参阅标记答案以供参考。

在这种情况下,我通常使用 chrome 开发人员工具来查找其填充或边距使页面宽度超过设备宽度的任何元素。在这种情况下,它是您的 <h1 class="site-title">sival</h1>。请参阅下面的屏幕截图。将 margin: 0 添加到该元素的样式(或以其他方式修复该元素)应该可以解决您的问题。

此图像未设置为 device-width 导致您的媒体查询出现问题。

  <img src="http://sival.dk/wp-content/uploads/2015/09/Logo.png" width="450" height="168">

并且需要设置此标题标签边距。

<h1 class="site-title">sival</h1>