我在WordPress中添加了一个引导框架到一个新的主题,我的下拉菜单没有完全显示。我已经尝试了z-index
,但仍然什么都没有。有人能帮助我吗?
谢谢!
<nav class="navbar navbar-default navbar-fixed-top">
<div class="container-fluid"> <!-- container-fluid -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span> <!-- do not remove these, this will be visible on the mobile devices -->
<span class="icon-bar"></span> <!-- do not remove these, this will be visible on the mobile devices -->
<span class="icon-bar"></span> <!-- do not remove these, this will be visible on the mobile devices -->
</button>
<a class="navbar-brand" href="<?php bloginfo('url')?>">
<img src="<?php echo get_template_directory_uri(); ?>/assets/main_logo.png" alt="beekeeper-design-studio-logo.png" title="Beekeeper Design Studio Logo"/>
</a>
</div>
<div class="navbar-right">
<?php /* for Bootstrap navbar use this php from - https://github.com/twittem/wp-bootstrap-navwalker */
wp_nav_menu( array(
// name of the menu which you created in wp admin panel
'menu' => 'wp-primary-menu',
'depth' => 2,
'container' => 'div',
'container_class' => 'collapse navbar-collapse',
'container_id' => 'bs-example-navbar-collapse-1', // to collapse the navbar in responsive
'menu_class' => 'nav navbar-nav', // ul menu class
'walker' => new wp_bootstrap_navwalker() //Process nav menu using our custom nav walker
));
?>
</div>
</div> <!-- container-fluid -->
</nav>
下面是这段代码的HTML输出。
下拉列表没有向前或向后,实际上没有超出导航栏容器。增加导航栏高度显示下拉列表。
2条答案
按热度按时间i86rm4rw1#
01 2023年[更新]
运行正常。问题出在
navbar
类中的overflow
。我把它设置为“溢出:可见“,它现在正在工作。
20jt8wwn2#
尝试更改隐藏元素的z索引(我使用的是1000,但请尽量使用最小值)。