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

主要问题是菜单项从页面底部溢出。我曾试图解决这个问题，但我没有这样做，我真的在试图解决它时筋疲力尽了。此菜单位于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初学者工具包：

---

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

也许您应该将高度设置为下拉菜单类，否则“溢出：自动”将无法工作