html - 扩展 Bootstrap 下拉子菜单，使其与父菜单保持一致

Question

我希望下拉导航中的子菜单与其父菜单内联。第一个链接是内联的，因为 - .dropdown-submenu > .dropdown-menu {top:0;} 但对于子菜单中的其他链接，“顶部”位置相对于其父菜单链接发生变化。请看http://bootply.com/66517

            <ul class="dropdown-menu">
                                <li class="dropdown-submenu">
                                <a href="#">More options</a>
                                <ul class="dropdown-menu">
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                </ul>
                                </li>
                                <li class="dropdown-submenu">
                                <a href="#">More options</a>
                                <ul class="dropdown-menu">
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                </ul>
                                </li>
                                <li class="dropdown-submenu">
                                <a href="#">More options</a>
                                <ul class="dropdown-menu">
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                    <li><a href="#">Second level link</a></li>
                                </ul>
                                </li>
                                <hr>
                            </ul>
                            </li>           
                        </ul>

Answer 1

你可以试试这个

这会很好地工作

.dropdown-submenu {
    position: static !important;;
}

你可以在你的分钟内找到这个CSS。 bootstrap 的 css 版本，但我更希望您在包含此下拉列表的特定页面上对其进行修改。