Появляются отступы в Chrome на Android

328
26 ноября 2016, 19:43

Появляются отступы в Chrome

Отступы появляются только тогда, когда на странице есть хотя бы один <input type="text" />. Когда input нет, все показывается корректно. На десктопе все отлично, Html * { min-height:1000000px; } прописано.

Когда прописываю <meta name = "viewport" content = "width=device-width, initial-scale=1">, отступы исчезают, но такой вариант не подходит, нужно чтобы сайт масштабирования во всю ширину сразу при открытии.

Красным выделил блоки, где появляются отступы. На второй картинке установлен <meta name = "viewport" content = "width=device-width, initial-scale=1">

Стили банальны до безумия. Например, телефон:

<div class="header__phone" style="background: red;">Телефон</div>

Его стиль:

.header__phone {
    float: right;
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    text-align: right;
}
.header__phone:before {
    height: 100%;
    display: inline-block;
    vertical-align: middle;
    content: '';
}

Стоит только добавить в любое место страницы <input type="text" />. И сразу появляются отступы.

Базовые стили сбрасывал, не помогает.

READ ALSO
Почему не работают вложенные селекторы?

Почему не работают вложенные селекторы?

Не судите сдорого, начал осваивать верстку лишь 2 недели назадПроблема в том что все вложенные и добавочные селекторы будто бы игнорируются...

282
Получения HTML из TinyMce

Получения HTML из TinyMce

Добрый день! Подскажите, как сохранять в базу данных контент из TinyMCEПри использовании tinymce

244