Блог

Главная - Вопросы по программированию - Как мне создать панель во всю ширину браузера, не искажая масштаб на iPhone?

Как мне создать панель во всю ширину браузера, не искажая масштаб на iPhone?

#css #webkit #mobile-safari

#css #webkit #mobile-safari

Вопрос:

Я пытаюсь создать цветные полосы, которые растягиваются по всему экрану, как http://css-tricks.com/9443-full-browser-width-bars / и невозможно переставить DOM, чтобы сделать это проще.

Этот метод великолепен в настольных браузерах, но в мобильном WebKit overflow-x не скрыт, и вы можете увеличивать масштаб, уменьшать или прокручивать до тех частей страницы, которые содержат только невероятно широкие цветные полосы. Это не помогает настроить область просмотра.

Как мне получить этот эффект, не искажая масштаб?

Ответ №1:

Вы пробовали добавлять overflow-x: hidden; к родительскому элементу полосы прокрутки? Я нашел этот метод полезным при разработке для мобильных браузеров на базе webkit. 

 <body>
    <div id="wrap" style="overflow-x: hidden;">
        <div id="massive_coloured_bar" style="your full-width technique here"></div>
    </div>
</body>