Question

我正在使用twitters bootstrap来创建响应式网站。我有一个带有相当多链接的下拉列表，当我在移动视图中而不是使导航折叠区域更大时，它会创建滚动效果。有没有办法让下拉力量崩溃导航div增加大小或推迟我的内容？

以下是我目前正在使用的代码。

<div class="row">
    <div class="col-md-12">
        <nav  id="menu1"  class="navbar navbar-default" role="navigation">
            <div class="navbar-header">
                 <div id="logo" class="pull-left hidden-md hidden-lg">
                        <div class="logo-small">
                            <img src="<?php bloginfo('template_directory');?>/images/logo-xs.png" alt="small-logo" class="img-responsive"/>


                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                                </div>
                     </div>
            </div>
            <?php wp_nav_menu( array( 'theme_location' => 'main-menu',
                                    'depth' => 2,
                                      'container_class' => 'collapse navbar-collapse',
                                     'menu_class' => 'nav nav-pills nav-justified',
                                    'walker' => new wp_bootstrap_navwalker() )); ?>

        </nav>
    </div>
</div>

Answer 1

尝试将以下内容添加到您的CSS中。

.navbar-collapse{
    max-height:auto;
}

Twitter引导下拉列表创建一个滚动条

1 个答案: