Question

我目前有一个基础轨道运行如下：

     <ul data-orbit>

          <li> 
            <img class="image1" src="../templates/img/image1.jpg" style="width: 100%;       height: 691px; margin: 0 auto;"/>   
          </li>
          <li>
             <img class="image2" src="../templates/img/image2.jpg" style="width: 100%; height: 691px; margin: 0 auto;"/>   
        </li>
         <li>
            <img class="image3" src="../templates/img/image3.jpg" style="width: 100%; height: 691px; margin: 0 auto;"/>   
        </li>
     </ul>

在Windows上，浏览器检查正常。但是，在Mac OS X Safari上，它显示下一个列表项图像，而不是显示整个100％宽度。

我猜它与显示的图像的实际宽度和高度有什么关系不一样......？

我想尝试修复这个小问题，而不必将所有图像剪切为相同的宽度和高度，因为它仅适用于mac safari。

我试图改变foundation.orbit.js来改变 $ slides.css（在第340行附近）读取jquery.safari并试图改变它的宽度，但它最终会在safari上拉伸图像。

谢谢！

Answer 1

我注意到在MAC OS X中，clientWidth比它应该的短1px（1038而不是1039px）。

通过在Safari浏览器上强制CSS的宽度为1039px !important，它解决了这个问题。
我不知道为什么宽度被迫比它短1px，但无论如何。

Safari MAC OS X上的基础轨道关闭中心

1 个答案: