html - 宽度 :auto in firefox is not working as intended

Question

所以，我有一个包裹在 div 中的图像 (.indexWrap):

<div id = "slider">      
<div class="indexWrap">                 
        <img class="indexImage" src="">                             
       </div>
</div>

在名为 #slider 的 div 中通过 php 在页面加载时创建了其中的 8 个。我正在使用 smooth Div Scroll在主页上显示这些图像。在 Chrome 中一切看起来都很好，在 IE 8 和 9 中看起来也不错。问题出在 firefox 中。每个图像的 div.indexWrap 的自动宽度设置不正确。 div 似乎向右额外拉伸(stretch)了 200-300 像素。这是 CSS:

#slider{
    position: relative;
    top:50px;
    width:100%;
    height:275px;
}
div.scrollWrapper
{
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}

div.scrollableArea
{
    position: relative;
    width: auto;
    height: 100%;
}
.indexWrap{
    float:left; 
    position:relative;
    width:auto;
    height:100%;

    padding-right:50px;
    padding-left:50px;
}
img.indexImage{
    float:left;
    position:relative;
    width:auto;
    height:100%;
}  

这里是有问题的实时版本的链接:jasone.co

编辑: 最重要的是，在页面加载时，每个 div.indexWrap 都没有被正确填充，但是随着滚动的开始，下一个检索到的元素被正确地填充了，有点蹩脚。可能是这一切的原因。

Answer 1

尝试添加display: inline-block;