Отзывчивый Главное меню Не Расширение

Question

я поручено поддержание веб-сайта, но имеют ограниченный опыт передовых аспектов CSS, кодирование и т.д.

Сайт размещен на Wordpress и находится here.

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

Answer 1

Проблема возникает из вашей ссылки

<a href="http://icarek9.com" class="logo"><h1>iCareK9 Dog Boarding &amp; DayCare  </h1></a> 

со стилем

#header a.logo { 
    z-index: 1002; 
    position: absolute; 
    width: 95%; 
    background-size: contain; 
} 

, делающего над вашей кнопкой.

Вы можете опустить эту ссылку на странице, например: (10px должно быть достаточно)

#header a.logo { 
    z-index: 1002; 
    position: absolute; 
    width: 95%; 
    background-size: contain; 
    top: 10px 
} 

или может увеличить Z-индекс вашей кнопки на что-то выше, чем 1002, поэтому он будет оказывать выше ваша ссылка

.navbar-toggle { 
    margin-right: 0; 
    z-index: 1003 
} 

Глядя на инспектора вашего браузера, вы можете увидеть укладку ваших элементов. Особенно в Firefox вы можете использовать эту функцию: https://developer.mozilla.org/en/docs/Tools/3D_View

Answer 2

У вас есть элемент в .headbg, который перекрывает гамбургер.

Вы можете обратиться к нему, применяя более высокий индекс z к #top-bar, чем в .headbg. Просто дайте #top-bar a z-index: 1003; (будет выше #header a.logo, что равно 1002), и это сделает ссылки в #top-bar на верхней части .headbg, в то же время позволяя вам щелкнуть ссылку в .headbg.