我有一个正确的菜单项，有一个3列下拉菜单，如何让该下拉菜单从行的开头从左到右打开，而不是从它所属的项打开？
我的代码：
<div class="container" style="min-height:150px">
<nav class="navbar navbar-default navbar-fixed-top my_nav" role="navigation">
<header>
<div class="row" style="max-width: 1200px;
width: 100%; margin:0 auto">
<div class="col-sm-5 col-xs-12">
<a id="logo" href="index.html"><img src="images/logo.png" /></a>
</div>
<div class="col-sm-7">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<!--/.navbar-header-->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav my_nav1">
<li>
<a href="index.html">Home </a>
</li>
<li>
<a href="about.html">About us </a>
</li>
<li class="dropdown active">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Solutions <b class="caret"></b></a>
<ul class="dropdown-menu multi-column columns-3">
<div class="row">
<div class="col-sm-3">
<ul class="multi-column-dropdown">
<li>
<a href="smarthome.html">Smart home system</a>
<ul>
<li><a href="elan.html">Elan</a></li>
<li><a href="fibaro.html">Fibaro</a></li>
</ul>
<li class="divider">
<li><a href="a-v-controllers.html">A/V distribution systems</a>
</li>
<li class="divider"></li>
</li>
</li>
</ul>
</div>
<div class="col-sm-3">
<ul class="multi-column-dropdown">
<li>
<a href="#">Surveillance Systems</a>
<ul>
<li>
<a href="#">Avtech</a>
<ul>
<li><a href="ip-camera.html">IP Cameras </a></li>
<li><a href="cctv-camera.html">CCTV Cameras </a></li>
<li><a href="hdtv.html">HDTVI Camera </a></li>
<li><a href="nvr.html">N-V recorder </a></li>
<li><a href="dvr.html">D-V recorder </a></li>
<li><a href="hd-dvr.html">HD DVR </a></li>
</ul>
</li>
<li><a href="cameras.html">Elan</a></li>
</ul>
</li>
<li class="divider"></li>
</ul>
</div>
<div class="col-sm-3">
<ul class="multi-column-dropdown">
<li>
<a href="alarm.html">Alarm system </a>
<ul>
<li><a href="jablotron-100.html">Jablotron100 </a></li>
<li><a href="jablotron-80.html">Jablotron80 </a></li>
<li><a href="azor.html">azor</a></li>
</ul>
</li>
<li class="divider"></li>
<li>
<a href="#">Telephone System </a>
<ul>
<li><a href="panasonic.html">Panasonic </a></li>
<li><a href="samsung.html">Samsung </a></li>
<li><a href="kocom.html"> kocom </a></li>
<li><a href="comex.html"> comex </a></li>
</ul>
</li>
</ul>
</div>
<div class="col-sm-3">
<ul class="multi-column-dropdown">
<li>
<a class="#">Electric Doors </a>
<ul>
<li>
<a href="swing.html">Swing</a>
<ul >
<li><a href="QUIKO.html">QUIKO </a></li>
<li><a href="Vulcan.html">Vulcan </a></li>
<li><a href="Calypso.html">Calypso </a></li>
</ul>
</li>
<li>
<a href="#">Sliding </a>
<ul>
<li><a href="quiko-sl.html">QUIKO </a></li>
</ul>
</li>
</ul>
</li>
<li><a href="cen-v.html">Central vacuum</a></li>
</ul>
</div>
</div>
</ul>
</li>
<li><a href="contact.html">Contact us</a></li>
</ul>
</div>
<!--/.navbar-collapse-->
</div>
</div>
</header>
</nav>
</div>