Bootstrap 3 Media Queries работает на Chrome, но не на мобильных устройствах

Question

Ok вопрос был задан много времени, прежде чем я прошел через каждый и каждый из них, но он не работал для меня

В мобильном режиме я хочу установить слайд-шоу положение Col из относительно статики, которая приведет в эту

Но вместо этого я вижу это на мобильный (примыкающей седловине перекрывается)

, что означает, что Col все еще находится в относительном положении, а медиа-запросы не работают на мобильных платформах, однако он работает в браузере Desktop 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

Попробуйте использовать эти решения

@media screen and (max-width: 760px){ 
    .slideshow-col { 
     position: relative; 
     height: 300px; <-- height of the slideshow 
     // You can use min & max height of slideshow for mobile devices 
     height: auto; 
     min-height: xxx; 
     max-height: xxx; 
    } 
}