Определенные браузеры отображают пробелы в нижней части экрана телефона

#html #css #brave

Вопрос:

У меня странная проблема, которая возникает в определенных браузерах и, вероятно, связана с окном просмотра (я новый разработчик, поэтому не до конца понимаю правильные термины).

Браузеры, в которых есть проблема:

  • Храбрый Браузер
  • Дакдакго

Браузеры, в которых нет этой проблемы:

  • Сафари
  • Google Chrome

Когда я прокручиваю страницу до самого низа, появляется небольшое количество пробелов, которые не исчезают, независимо от того, что я делаю.

У меня есть:

  • Добавлена ширина и высота 100% в нижний колонтитул
  • Добавлена минимальная высота 100 вч
  • Проверено на наличие фантомных персонажей
  • Изменено положение скриптов в HTML

Там, где начинается белый цвет, экран начинает изгибаться (на iPhone 11).

Это фрагменты моего CSS-кода, которые могут быть полезны (нижний колонтитул-вторая серая строка в нижней части черного раздела).:

 * {
    margin: 0;
    padding: 0;
    outline: none;
    font-family: "Raleway", serif;
    font-weight: 400;
    box-sizing: border-box;
}

/* Footer */
.footer {
    background-color: #0e1111;
}
.footer_wrapper {
    color: grey;
    max-width: 2000px;
    margin: 0 auto;
    padding: 0 10%;
}
.copyright {
    font-size: 15px;
    letter-spacing: 1px;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
    border-top-width: 1.5px;
    border-top-style: solid;
    border-top-color: #232323;
}

/* End of code */
 

В нижней части моего экрана:
Мой экран

Кто-нибудь знает, почему это может происходить, и если потребуется предоставить еще какой-либо код, я обновлю сообщение.

Ответ №1:

Чтобы решить эту проблему, мне пришлось заполнить цвет кузова.

 body {
    background-color: black;
}
 

Похоже, это что-то специфичное для отдельных браузеров, таких как многие популярные веб-сайты, такие как bbc.co.uk и news.sky.com чтобы назвать некоторые из них, у вас та же проблема (когда нижний колонтитул не распространяется прямо на нижнюю часть экрана).