Изображения кажутся обрезанными, когда начинается анимация карусели flexslider. Возможно ли, что эта проблема входит в код стиля flexslider.css?
Полный код с анимацией можно найти здесь:
Я помещаю здесь неполный код flexslider.css, где подозревается проблема.
.flexslider {
width: 250px;
height: 600px;
background: black;
}
.slides {
width: 100%;
height:100%;
padding:0;
padding-left:30px;
}
.slide {
width: 100%;
}
.slide img {
width: 100%;
}
.col{
float:right;
}
#side{
width: 40%;
margin-right: 150px;
margin-top: 0px;
}
Я могу воспроизвести вашу проблему здесь: http://codepen.io/anon/pen/akjzx
Теперь я не уверен, что вызвало проблему, так как вы не смогли получить демо-версию вместе. Я рекомендую играть со следующим значением CSS. Он должен обеспечить решение вашей проблемы.
.slides {
width: 100%;
height: 100%;
padding-left: -30px; /* Adjust this value; try a negative value */
}
Я также рекомендую щелкнуть правой кнопкой мыши изображения в Chrome и выбрать "Осмотреть элемент". Это поможет вам отладить CSS и, возможно, определить, что заставляет изображение отключиться.
Специально вы можете добавить:
.flexslider .slides > li { padding-left: 0; }