Bootstrap 3媒体查询在Chrome上运行但在移动设备上运行

Question

好的，很久以前就问了这个问题，我经历了每一个问题，但是对我来说没有问题

在移动视图中，我想将幻灯片列位从“相对”设置为“静态”，这将导致此

但相反，我在手机上看到了这一点（相邻的col重叠）

这意味着Col仍处于相对位置，媒体查询无法在移动平台上运行，但它可以在桌面Chrome浏览器中使用。

我使用了元标记以及最小值和最大值的不同组合（确认屏幕分辨率后）

例如

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

 /* Smartphones (portrait and landscape) ----------- */
    @media only screen
    and (min-width : 320px)
    and (max-width : 480px) {

section.banner .slideshow-col{
        position: static;
    }

    /* Smartphones (landscape) ----------- */
    @media only screen
    and (min-width : 320px) {

section.banner .slideshow-col{
        position: static;
    }

 @media (min-width : 700px) {
   section.banner .slideshow-col{
        position: static;

    }

@media (min-width: 992px) {


        section.banner .slideshow-col{
        position: relative;
    }}

@media (min-width: 1200px) {


        section.banner .slideshow-col{
        position: relative;
    }}

我的网站在这里http：//

任何提示？

Answer 1

尝试使用此解决方案

R3uK's answer