菜单列表溢出HTML（也在iframe中）

Question

主要问题是菜单项从页面溢出到底部。我试图解决这个问题而我没有这样做，而且我真的已经把自己烧掉了，试图修复它。此菜单位于iframe中，但即使它位于常规页面上，仍会出现问题。问题的图片如下：

这是代码

<div class="navbar navbar-default navbar-inverse navbar-fixed-top">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-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 id="roleMenu" class="collapse navbar-collapse navbar-ex1-collapse">
                    <ul id="menuUL" class="nav navbar-nav">
                        <li{{ (Request::is('admin') ? ' class="active"' : '') }}><a href="#"><span class="glyphicon glyphicon-home"></span> Home</a></li>
                        <li{{ (Request::is('admin/blogs*') ? ' class="active"' : '') }}><a href="#"><span class="glyphicon glyphicon-list-alt"></span> Pages</a></li>
                        <li{{ (Request::is('admin/comments*') ? ' class="active"' : '') }}><a href="#"><span class="glyphicon glyphicon-bullhorn"></span> Comments</a></li>
                        <li{{ (Request::is('admin/menuBuilder*') ? ' class="active"' : '') }}><a href="#"><span class="glyphicon glyphicon-bullhorn"></span> Menu Builder</a></li>
                        <li class="dropdown{{ (Request::is('admin/users*|admin/roles*') ? ' active' : '') }}">
                            <a class="dropdown-toggle" data-toggle="dropdown" href="{{{ URL::to('admin/users') }}}">
                                <span class="glyphicon glyphicon-user"></span> Users <span class="caret"></span>
                            </a>
                            <ul class="dropdown-menu">
                                <li{{ (Request::is('admin/users*') ? ' class="active"' : '') }}><a href="#"><span class="glyphicon glyphicon-user"></span> Users</a></li>
                                <li{{ (Request::is('admin/roles*') ? ' class="active"' : '') }}><a href="#"><span class="glyphicon glyphicon-user"></span> Roles</a></li>
                            </ul>
                        </li>
                    </ul>
                    <ul class="nav navbar-nav pull-right">
                        <li><a href="{{{ URL::to('/') }}}">View Homepage</a></li>
                        <li class="divider-vertical"></li>
                        <li class="dropdown">
                                <a  class="dropdown-toggle"  data-toggle="dropdown" href="#">
                                    <span class="glyphicon glyphicon-user"></span> {{{ Auth::user()->username }}}   <span class="caret"></span>
                                </a>
                                <ul class="dropdown-menu " style="overflow:scroll"; >
                                    <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> A</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> B</a></li>
                                        <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> C</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> d</a></li>
                                    <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> e</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> f</a></li>
                                        <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> g</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> h</a></li>
                                    <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> i</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> j</a></li>
                                        <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> k</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> l</a></li>
                                    <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> m</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> n</a></li>
                                        <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> o</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> p</a></li>
                                    <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> q</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> r</a></li>
                                        <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> s</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> t</a></li>
                                    <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> u</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> v</a></li>
                                        <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> w</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> x</a></li>
                                    <li><a href="{{{ URL::to('user/settings') }}}"><span class="glyphicon glyphicon-wrench"></span> y</a></li>
                                    <li class="divider"></li>
                                    <li><a href="{{{ URL::to('user/logout') }}}"><span class="glyphicon glyphicon-share"></span> z</a></li>
                                    <li class="divider"></li>

                                </ul>
                        </li>
                    </ul>
                </div>
            </div>
        </div>

采取了多种方法：

1）设置溢出：滚动到下拉类：

结果：它有效但根本不理想。

2）设置溢出：滚动到下拉菜单类：

结果：滚动条出现但没有做任何事情（也就是滚动不起作用）

3）试图在这里做解决方案。如果我更改html或css以使其兼容它会破坏已经制作的其他东西并且看起来很糟糕。如果有人能帮助我，我会非常感激。

更多信息可以提供帮助：   我的代码基于laravel入门套件：https://github.com/andrewelkins/Laravel-4-Bootstrap-Starter-Site

我已经在这里做了几个小时的研究，没有任何东西对于这似乎是一个简单的解决方案，主要是因为我的菜单栏的结构方式。任何愿意提供帮助，css，javascript或任何其他可以帮助我的人都将不胜感激。

Answer 1

也许你应该将高度设置为下拉菜单类，否则＆＃39; overflow：auto＆＃39;不会工作