Carousel 堆叠图像：仅限 Webkit、Chrome、Safari

Question

http://174.120.239.48/~peakperf/?page_id=260

如果您使用 webkit 浏览器、Chrome/Safari 查看该页面，您会看到轮播内容相互叠加。

如果您在 Mozilla 或 IE 中查看，内容显示正常。

我从来没有在 webkit 中遇到过这样的错误，所以这对我来说是全新的。

任何帮助将不胜感激。

谢谢！

CSS：

.theme-twentycarousels {
    width: 610px;
}

.scrollertitle p{
    margin: 0;
    padding: 0;
}
.scrollertitle h2{
    padding-left: 10px;
    padding-top: 10px;
    text-transform:uppercase;
    font-size: 15px;
    font-weight: bold;
}
.scrollertitle .arrow-right {
    width:12px;
    float:right;
    height: 37px;
}

 .scrollertitle .arrow-left {
    width:12px;
    height:37px;
    float:left;

}

.scrollertitle .arrow-left a {
    margin:-20px 0 0 0;
    width:12px;
    height:37px;
    background:url(img/arrow_left.png) top left no-repeat;
    display:block;

}

.scrollertitle .arrow-right a {
    margin:-20px 0 0 0;
    width:12px;
    height:37px;
    background:url(img/arrow_right.png) top right no-repeat;
    display:block;
}

.theme-twentycarousels .hide { display:none; }

.theme-twentycarousels .stepcarousel {
    position: relative; /* Leave this value alone */
    overflow: scroll; /* Leave this value alone */
    height: 155px;
    background:#EEEFF4;
    width: 610px;

}

.theme-twentycarousels .stepcarousel .belt{
    position: absolute; /* Leave this value alone */
    left: 0;
    top: 0;
    margin: 0px;

}

.theme-twentycarousels .stepcarousel .panel {
    height:100px;
    float: left; /* Leave this value alone */
    padding:10px;
    background:#EEEFF4;
    display:block;
    width: auto;
}

.theme-twentycarousels .stepcarousel .panel .panel-text {
    font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;
    color:#FFF;
}

.wp_carousel_twentycarousels_pagination {
    padding:5px 10px;
    background:#000;
    text-align:center;
    visibility:hidden;
}
.scrollertitle{
    height: 37px;
    background: url(img/scrollertitle.jpg) no-repeat;
    width: 610px;
}
.arrowcontainer{
    width: 50px;
    height: 37px;
    float: right;
    margin-right: 10px;
}

Answer 1

由于某种原因，当我在 Chrome 的检查器中查看它们时，您保存图像的 div（带有 class=panel 的 div）具有内联样式。

style="float: none; position: absolute; left: 0px;"

从所有这些特定的 div 中删除它可以防止它们相互堆积——但是，它们不再适合所有的东西了。

我也注意到你有

.theme-twentycarousels .stepcarousel .panel

在样式表的两个地方。不确定这是否会导致任何问题。