HTML code:
My CSS: .menu{ width:940px; height: 30px; border-width:1px; border-top-style:solid; border-bottom-style:solid; border-color: grey; padding:10px; background-color: rgb(212,229,190); } .row .nav-pills .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 245px; padding: 0; margin: 0; list-style: none; rgb(180, 210, 135) background-color: #ffffff; border-width:0 1px 1px 1px; border-color:rgb(180, 210, 135); -webkit-box-shadow: 0 5px 10px rgba(180, 210, 135, 0.2); -moz-box-shadow: 0 5px 10px rgba(180, 210, 135, 0.2); box-shadow: 0 5px 10px rgba(180, 210, 135, 0.2); -webkit-background-clip: padding-box; -moz-background-clip: padding; background-clip: padding-box; border-top-right-radius: 0px; border-top-left-radius: 0px; } Added css of links .menu .nav-pills .dropdown-menu a { display: block; padding-top: 5px; padding-left: 10px; clear: both; font-weight: normal; line-height: 18px; color: black; white-space: nowrap; } .menu .nav-pills .dropdown-toggle { border: 1px solid #B4D287; background-color: white; margin-bottom: 0px; } [1]: http://i.stack.imgur.com/yNBIL.png [2]: http://i.stack.imgur.com/J1mIn.pngGive it fixed width. in CSS I only see min-width, but not
width: 245px;
,