Я пытаюсь отобразить список навигации wordpress на ul, но он не отображается, если я пишу еще несколько слов в элементе списка, который он показывает, я не мог идентифицировать проблему !!!Список навигации Wordpress не отображается
вот мой код: HTML
<div class="menu-toggle">
<div class="one"></div>
<div class="two"></div>
<div class="three"></div>
</div>
<nav class="toggle-navg">
<ul role="navigation" class="hidden">
<li> <?php wp_nav_menu(array('theme_location' => 'extra-menu', 'container_class' => 'my_extra_menu_class')); ?></li>
</ul>
</nav>
</div>
и CSS
.menu-toggle {
width: 40px;
height: 30px;
position: absolute;
top: 20px;
left: 25px;
cursor: pointer;
z-index:99;
}
.menu-toggle.on .one {
-moz-transform: rotate(45deg) translate(7px, 7px);
-ms-transform: rotate(45deg) translate(7px, 7px);
-webkit-transform: rotate(45deg) translate(7px, 7px);
transform: rotate(45deg) translate(7px, 7px);
}
.menu-toggle.on .two {
opacity: 0;
}
.menu-toggle.on .three {
-moz-transform: rotate(-45deg) translate(8px, -10px);
-ms-transform: rotate(-45deg) translate(8px, -10px);
-webkit-transform: rotate(-45deg) translate(8px, -10px);
transform: rotate(-45deg) translate(8px, -10px);
}
.one,
.two,
.three {
width: 100%;
height: 5px;
background: white;
margin: 6px auto;
backface-visibility: hidden;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.toggle-navg ul {
margin: 0;
padding: 0;
font-family: Open Sans;
list-style: none;
margin: 4em auto;
text-align: center;
}
.toggle-navg ul.hidden {
display: none;
}
.toggle-navg ul a {
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
-webkit-transition-duration: 0.5s;
transition-duration: 0.5s;
text-decoration: none;
color: black;
font-size: 3em;
line-height: 1.5;
width: 100%;
display: block;
}
.toggle-navg ul a:hover {
background-color: rgba(0, 0, 0, 0.8);
}
.menu-section.on {
z-index: 10;
width: 100%;
height: 100%;
display: block;
background-color: rgba(0, 0, 0, 0.8);
position: absolute;
opacity: 0.7;
}
.menu-toggle {
left: 85%;
}
Покажите нам также * оказанные HTML *. Возможно, ваше меню будет * пустым *, и в этом случае ничего не будет видно, и решение состоит в том, чтобы обеспечить, чтобы ваше меню было построено и что ваш 'theme_location' соответствует. –
вы можете проверить элемент, HTML пришел или нет – Samyappa