响应式轮播在 Chrome 较小的视口中不工作，但在 FF 中工作

Question

请帮助我寻找解决方法。我有这个网站： http://www.ktlpro.com/

据我所知，这在除 CHROME @ 某些视口之外的所有浏览器中都能完美运行。我不明白为什么这个滑块不能正常工作。

我认为 Chrome 中存在问题的视口是 680、768，也许还有 480。请帮忙！

它在 chrome 中的样子： Chrome below 768

Answer 1

您在 480px 和 767px 之间有以下 css：

@media (max-width: 767px)
#main-slide .slider-content h3 {
    font-size: 14px;
    margin-top: 5px;
}

将其更改为类似这样的内容即可解决问题：

@media (max-width: 767px)
#main-slide .slider-content h3 {
    font-size: 14px;
    margin-top: 65px; //You can increase this if you wish
}

Responsive carousel not working in Chrome smaller viewports, but works in FF