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

Question

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

Он идеально подходит для мобильных устройств, планшета, рабочего стола, который создает проблему. Вот ссылка, открыть и закрыть окно, и вы увидите, что я имею в виду:

[связаны] удален

спасибо!

Answer 1

делает некоторые детективной работы, произошли две вещи, одна, я добавил исправление для ошибки Chrome ранее в заголовке:

body:after { 
     display: initial; 
     position: absolute; 
     top: 0; 
     visibility: hidden; 
    } 

И второе, нужно, чтобы компенсировать это с дополнением:

.iosSlider .slider .item img { 
    width: 100%; 
    height: auto; 
    float: left; 
    padding-top: 15px; 
} 

эффект домино.

Answer 2

Aha! Найди его!

---

ИТАК когда окно достаточно мал, чтобы «квалифицировать» в качестве мобильного устройства, вы один очень важное свойство установить на ваш заголовок:

position: static; 

Это означает, что заголовок в поток документа. При изменении размера рабочего стола, который получает изменено на

position: fixed; 

Это занимает верхний заголовок из потока документа, скользя другой контент вверх в свое место.

Таким образом, чтобы исправить это, вы можете сделать что-то вроде этого:

@media screen and (min-width: 700px) /*<--your min desktop width here*/ 
{ 
    body 
    { 
     margin-top: 40px; /*header height here*/ 
    } 
} 

Answer 3

использование ниже коды в навигационном сНе CSS файла

position: relative; 
    z-index: 100;