2016-03-05 21 views
0

我一直在使用此菜单,并且无法将我的菜单部分显示在同一行内。到目前为止,我一直在如何在bootstrap的网站下嵌套行。任何帮助表示赞赏!提前致谢!这是我到目前为止有:无法在同一行上获取内容

<div class="row">  
 
     <div class="menu container-fluid"> 
 
      <div class="row"> 
 
       <div class="dropdownn col-xs-12 col-md-6"> 
 
        <button class="btn dropdown-toggle" type="button" id="espressoDrinks" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
 
        Espresso Drinks 
 
        <span class="caret"></span> 
 
        </button> 
 
        <ul class="dropdown-menu" aria-labelledby="espressoDrinks"> 
 
         <ul> 
 
          <li>Espresso</li> 
 
           <p>2 oz. 4 oz. or 6 oz. of the finest pure espresso</p> 
 
          <li>Americano</li> 
 
           <p>Fresh brewed espresso with hot water</p> 
 
          <li>Macchiato</li> 
 
           <p>Espresso with a dallop of foam</p> 
 
          <li>Cappuccino</li> 
 
          <p>Espresso with steamed milk, topped with a crown of foam</p> 
 
         </ul> 
 
        </ul>  
 
       </div> 
 
      </div>  
 
       
 
      <!-- </div> --> 
 
      <div class="row"> 
 
       <div class="dropdown col-xs-12 col-md-6"> 
 
        <button class="btn dropdown-toggle" type="button" id="blendedEspresso" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
 
        Blended Espresso Shakes 
 
        <span class="caret"></span> 
 
        </button> 
 
        <ul class="dropdown-menu" aria-labelledby="blendedEspresso">  
 
         <ul> 
 
          <li>Blended Bliss</li> 
 
           <p>Espresso, chocolate and lowfat ice milk blended into a refreshing shake, topped with whipped cream. Delicious!</p> 
 
          <li>Java Chill</li> 
 
           <p>Brewed espresso blended with lowfat ice milk, a splash of a flavor of your choosing, and topped with whipped cream</p> 
 
          <li> White Mocha Chill</li> 
 
           <p>Blended Ghirardelli white chocolate mocha capped with whipped cream</p> 
 
          <li>Malty-Malt</li> 
 
           <p>Blended chocolate mocha with malted milk and topped with whipped cream</p> 
 
          <li>Minty-Mint</li> 
 
           <p>Blended mocha spun with a whole peppermint patty and topped with cream</p> 
 
         </ul> 
 
        </ul> 
 
       </div> 
 
      </div> 
 
     </div> 
 
    </div> 
 

 
<!-- begin snippet: js hide: false -->

回答

0

据我所知.row类是为了组织嵌套和/或.COL-XXX类。因此,您的所有.row必须放置在一个.container 然后,如果您要在.rows中组织内容,则必须将您的内容放置在.col-xxx中。

<div class="container"> 
 
    <div class="row"> 
 
    <div class=".col-md-6"></div><div class=".col-md-6"></div> 
 
    </div> 
 
<div class="row"> 
 
    <div class=".col-md-6"></div><div class=".col-md-6"></div> 
 
</div> 
 
</div>