Menu items not aligning in toggle dropdown

I implemented this Bootstrap 3 Navbar Collapse to change the navbar collapse but I am having a problem with the toggle on the nav.

I put in this for min-width: 992px to make my menu hover open rather than toggle for desktop sizes.

ul.nav li.dropdown:hover ul.dropdown-menu { 
display: block; 
}              /* adding hover effect to bs navbar only for md size and up */

.dropdown-menu > li > a {
text-align: right;
}

The problem I'm having is that when I toggle a menu item in the sm size. The dropdown menu doesn't toggle directly below. It goes off to the right hand side. I can't seem to find what is the css selector that is putting it directly below while the other items "move out of the way"

This is what is happening

bootstrap menu dropdown http://i57.tinypic.com/a4ogm0.png

I want this for sm-size

bootstrap menu dropdown http://i59.tinypic.com/2j4xzkx.png

Tried to insert my code into bootply... it doesn't collapse properly on there though??? http://www.bootply.com/Q2fqP7kfAK


Found out that the css for changing the collapse had a

.navbar-nav>li {
        float: none;
    }

that caused it to drift off to the side until it hit xs! Removed it and it's a-ok

thanks!


为设定宽度a标签

.dropdown-menu > li > a {
     text-align: right;
     width : 100%;
}
链接地址: http://www.djcxy.com/p/94558.html

上一篇: Twitter Bootstraps Yamm3下拉右转......奇怪?

下一篇: 菜单项在切换下拉菜单中未对齐