Flexslider Наложение изображений на более мелкие экраны

Question

Я пытаюсь сделать мобильную веб-страницу восприимчивой, однако изображения в flexslider на меньших экранах идут косо. Будь он загружен или уменьшен, изображение справа посягает на текущее изображение.

Я бы разместил изображение, но мне нужно больше очков репутации.

Я пытаюсь выяснить, как нажимать текущее изображение, просматриваемое так, чтобы край следующего изображения не показывался преждевременно.

Answer 1

Просто нужно добавить медиа-запрос, чтобы применить margin-left в определенной точке. просто не смог найти правило предназначаться на некоторое время:

.slides:first-child img{ 
    height: auto; 

} 

//fixes the bug where the second image appears on the right on smaller screens 
@media (max-width: 991px){ 
    .slides:first-child img{ 
    margin-left: 40px; 
    } 
} 

.flex-control-thumbs{ 
    margin-top: 20px; 
    li{ 
     cursor: pointer; 
     list-style-type: none; 
    } 
}