<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container-fluid main-container"> <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12 sidebar"> <!-- Menu --> <div class="side-menu"> <nav class="navbar navbar-default" role="navigation"> <!-- Main Menu --> <div class="side-menu-container"> <ul class="nav navbar-nav col-lg-12 col-md-12 col-sm-12 col-xs-12"> <!-- Dropdown--> <li class="panel panel-default" id="dropdown"> <a data-toggle="collapse" href="#dropdown-lvl1-1"> <span class="glyphicon glyphicon-book"></span>基本設計<span class="caret"></span> </a> <!-- Dropdown level 1 --> <div id="dropdown-lvl1-1" class="panel-collapse collapse"> <div class="panel-body"> <ul class="nav navbar-nav"> <!-- Dropdown level 2 --> <li class="panel panel-default" id="dropdown"> <a data-toggle="collapse" href="#dropdown-lvl1-2"> <span class="glyphicon glyphicon-tags"></span>サブシステム<span class="caret"></span> </a> <div id="dropdown-lvl1-2" class="panel-collapse collapse"> <div class="panel-body"> <ul class="nav navbar-nav"> <li><a href="#"><span class="glyphicon glyphicon-tag"></span>サブシステム登録／修正／削除</a></li> </ul> </div> </div> </li> </ul> </div> </div> </li> </ul> </div><!-- /.navbar-collapse --> </nav> </div> </div> </div>

.side-menu { position: relative; } .side-menu .navbar { border: none; } .side-menu .navbar-header { width: 100%; border-bottom: 1px solid #e7e7e7; } .side-menu .navbar-nav .active a { background-color: transparent; margin-right: -1px; border-right: 5px solid #e7e7e7; } .side-menu .navbar-nav li { display: block; width: 100%; border-bottom: 1px solid #e7e7e7; } .side-menu .navbar-nav li a .glyphicon { padding-right: 10px; } .side-menu #dropdown { border: 0; margin-bottom: 0; border-radius: 0; background-color: transparent; box-shadow: none; } .side-menu #dropdown .caret { float: right; margin: 9px 10px 0px; } .side-menu #dropdown > a { border-bottom: 1px solid #e7e7e7; } .side-menu #dropdown .panel-body { padding: 0; background-color: #f3f3f3; } .side-menu #dropdown .panel-body .navbar-nav { width: 100%; } .side-menu #dropdown .panel-body .navbar-nav li { padding-left: 15px; border-bottom: 1px solid #e7e7e7; } .side-menu .brand-name-wrapper .navbar-brand { display: block; }