Question

<ul class="dropdown-menu1 pull-left twoColumns">
                            <li class="dropdown submenu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Welcome Slip<b class="caret1" style="margin-left:98px"></b></a>
                            <ul class="dropdown-menu left33">
                                <li><a href="#">System Manual - L1</a></li> <li class="divider"></li>
                                <li><a href="#">Procedure Manual-L-II </a></li> <li class="divider"></li>
                                <li><a href="#">ROR</a></li> <li class="divider"></li>
                                <li><a href="#">Key Process Maps</a></li>
                            </ul>
                            </li>
                            <li class="divider"></li>
                           <li><a href="#">Is HelpDesk</a></li>
                           <li class="divider"></li>
                           <li><a href="#">Meeting Manager System</a></li><li class="divider"></li>
                           <li><a href="#">Outlook (Email on Intranet) </a></li><li class="divider"></li>
                           <li><a href="#">BPCL(R) Material Movement</a></li><li class="divider"></li>
                           <li><a href="#">Online Estates Services System</a></li><li class="divider"></li>
                           <li><a href="#">Online Housekeeping System</a></li><li class="divider"></li>
                           <li><a href="#">Electrical Maintenance Services</a></li><li class="divider"></li>
                           <li><a href="#">Spares Inventory Management </a></li><li class="divider"></li>
                           <li><a href="#">TECTrack - File Tracking System</a></li><li class="divider"></li>
                           <li><a href="#">Action Taken Report </a></li><li class="divider"></li>
                           <li><a href="#">Material Codification Request</a></li><li class="divider"></li>
                           <li><a href="#">Asset Disposal Tracking System</a></li><li class="divider"></li>

                           <li class="dropdown submenu">
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Online Purchase Requisition System<b class="caret1" style="margin-left:98px"></b></a>
                            <ul class="dropdown-menu left33">
                                <li><a href="#">System Manual - L1</a></li> <li class="divider"></li>
                                <li><a href="#">Procedure Manual-L-II </a></li> <li class="divider"></li>
                                <li><a href="#">ROR</a></li> <li class="divider"></li>
                                <li><a href="#">Key Process Maps</a></li>
                            </ul>
                            </li><li class="divider"></li>
                           <li><a href="#">Contract Monitoring System</a></li><li class="divider"></li>
                           <li><a href="#">License Tracking System</a></li><li class="divider"></li>
                           <li><a href="#">CyberDOCS Application</a></li><li class="divider"></li>
                           <li><a href="#">Scaffolding Material IssueTraker System</a></li><li class="divider"></li>
                           <li><a href="#">Scaffolding Material IssueTraker System</a></li><li class="divider"></li>
                           <li><a href="#">Telephone Directory</a></li><li class="divider"></li>
                           <li><a href="#">Vehicle Pass Management System</a></li><li class="divider"></li>
                           <li><a href="#">Access To Honeywell Network Camera</a></li><li class="divider"></li>
                           <li><a href="#">Access To Network Cameras</a></li><li class="divider"></li>
                           <li><a href="#">Public Relations Services</a></li><li class="divider"></li>
                           <li><a href="#">Online Fire & Safety Exam</a></li>
                      </ul>

子菜单隐藏在ul后面。怎么能在ul上面显示出来。 twoColumns类提供了css属性列：2使列表显示在两列中。当我徘徊在＆＃34;欢迎名单＆＃34;子菜单位于列表的第二列后面。请帮忙。

Answer 1

.submenu{position:relative;}
.submenu .dropdown-menu{position:absolute;z-index:999;}

希望它会起作用，如果没有请分享你的CSS也找出问题

Answer 2

尝试更简单的方法，请参阅this fiddle.

<div id="navbar">
<ul id="dropdown">
<li class="topnav"><a href="#">ITEM ONE</a>
     <ul>
        <div class="column">
           <li><a href="#">Subitem One</a></li>
           <li><a href="#">Second Subitem</a></li>
        </div>
        <div class="column">
           <li><a href="#">Subitem One</a></li>
           <li><a href="#">Second Subitem</a></li>
        </div>
        <div class="column">
           <li><a href="#">Subitem One</a></li>
           <li><a href="#">Second Subitem</a></li>
        </div>
     </ul>
  </li>
</ul>
</div>

对你有意义吗？

如何在两列下拉菜单中显示子菜单

2 个答案: