Карусель укладывает изображения: только Webkit, Chrome, Safari - PullRequest
1 голос
/ 19 января 2011

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;
}

1 Ответ

1 голос
/ 19 января 2011

По какой-то причине ваши div-ы, содержащие изображения, те, которые имеют панель class =, имеют встроенные стили, когда я смотрю на них в инспекторе в Chrome.отдельные дивы не позволяли им накапливаться друг на друге - но они больше не помещались в ряд подряд.

Я также заметил, что у вас есть

.theme-twentycarousels .stepcarousel .panel

в дваместа в вашей таблице стилей.Не уверен, что это вызывает какие-либо проблемы.

...