Question

当我在Chrome（移动设备）中打开它时，它工作得很完美，但是当我在safari（移动设备）上打开它时，会有一个右边距或它的内容以及x轴滚动即将到来，而我提到溢出-x是隐藏的。如果我把overflow-x隐藏起来那么它就不起作用了。

任何人都可以帮助我。

Answer 1

当我在Chrome浏览器的网页上模拟手机浏览器时，我看到的问题出在标记的这一行：

<div class="call-icon">
    <h5 class="text-center" id="#callbox">
        Talk to us
    </h5>
</div>

......这一行：

<div class="popup-header">
   <span class="popup-title">CONTACT
      <div class="popup-image"></div>
   </span> 
</div>

......这一行：

<a href="#" class="ti_scroll bounceInRight  animated" style="display: block;">
   <i class="fa fa-angle-up"></i>
</a>

所有这些元素都溢出到右边距，因此您需要更改其right-margin CSS样式，以便它们没有在右边距中的脚。它在Chrome移动设备中呈现得很好，但不是Safari移动设备，因为这两种浏览器的边距略有不同。有关如何使用Javascript检测Safari以便更改特定浏览器的样式，请参阅this post。

旁注：

将来，将您的网站链接到StackOverflow而不发布静态代码被认为是不正确的Asking Etiquette：

如果可以创建问题的实时示例链接到（例如，在http://sqlfiddle.com/或http://jsbin.com/上）然后这样做 - 但也包括你问题本身的代码。不每个人都可以访问外部网站，链接可能会随着时间的推移而中断。

仅限Safari浏览器中的右边距

1 个答案: