2015-10-30 2 views
1

По какой-то причине, вертикальная полоса прокрутки не работает на моем сайте, когда я к нему доступ на мобильном Safari (IOS 9.1, iPhone 5, Safari 8.1):Вертикальная прокрутка не работает на Mobile Safari

https://sleepy-anchorage-3222.herokuapp.com

мобильные отладочные результаты Safari прилагаются. Единственные релевантные ошибки, которые я вижу, - это 5 CSS, шумовые предупреждения, связанные с шрифтом, все остальное в порядке.

Вертикальный свиток отлично работает на iPhone 6, а также отлично работает на моем настольном браузере. Что тут происходит??

(Примечание: Я использую шрифты Высокие значки и макет FlexBox, не уверены, связаны ли они с проблемой).

MOBILE SAFARI DEBUG CONSOLE

enter image description here

Применимое SCSS КОД

@media (max-width:960px){ 
    > aside { 
    flex: 0 0 100%; 
    display: flex; 
    flex-flow: column nowrap; 
    height: 100%; 

     > header { 
     flex: 0 0 60px; 
     margin: 0 0px; 
     } 

     > main { 
     flex: 1 auto; 
     height: 100%; 
     overflow-y: scroll; 
     padding: 0 10px; 
     } 

.restaurant { 
    margin: 30px 0; 

    &.selected { 
    box-shadow: 0 0 5px 3px rgba(0,0,0,0.5);; 
    padding: 2px; 
    } 

    .item-image { 
    max-width: 100%; 
    } 

    } 

    figcaption { 
    min-height: 80px; 
    position: relative; 
    } 

    .item-rating { 
    display: inline-block; 
    position: absolute; 
    } 

ответ

1

Добавлено это тело тега:

-webkit-overflow-scrolling: touch; 

, и теперь он работает.

+0

это все еще актуально Я получаю сообщение об ошибке при добавлении этого недопустимого свойства – virtualLast

Смежные вопросы