<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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 ----------> <ul class="nav navbar-nav"> <li><a href="#">Link 1</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown <span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Sublink 1<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Sublink 1</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Sublink 2<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Sublink 1</a></li> <li><a href="#">Sublink 2</a></li> <li><a href="#">Sublink 3</a></li> </ul> </li> <li><a href="#">Sublink 3</a></li> </ul> </li> <li><a href="#">Sublink 2</a></li> <li><a href="#">Sublink 3</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Sublink 4<span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Sublink 1</a></li> <li><a href="#">Sublink 2</a></li> <li><a href="#">Sublink 3</a></li> </ul> </li> </ul> </li> <li><a href="#">Link 2</a></li> </ul>

.dropdown .dropdown > .dropdown-menu { top: 0; left: 100%; } .dropdown .dropdown:hover > .dropdown-menu { display: block; } .dropdown .dropdown .caret { position: absolute; right: 5px; top: 50%; margin-top: -3px; -moz-transform: rotate(-90deg); /* Firefox */ -ms-transform: rotate(-90deg); /* IE */ -webkit-transform: rotate(-90deg); /* Safari, Chrome, iOS */ -o-transform: rotate(-90deg); /* Opera */ transform: rotate(-90deg); }