html - 无法获取同一行的内容

Question

我一直在处理这个菜单，但我无法让我的菜单部分显示在同一行中。到目前为止，我一直在讨论如何在 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 -->

Answer 1

据我所知，.row 类用于组织嵌套和/或 .col-xxx 类。因此，您所有的 .rows 都必须放在一个 .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>