中心對齊按鈕與引導

Question

我陷入對齊線上的一些按鈕和所有以引導爲中心的卡住。

我創建了以下bootply sample。 爲什麼按鈕垂直堆疊而不水平？

另外，我必須與如下所示的代碼

@Html.ActionLink("REGISTER", "LoginRegister", "Account", new { LoginTabActive = false, RegisterTabActive = true }, new { @class = "btn btn-primary btn-lg center-block" }) 

產生以下標記

<a href="/Account/LoginRegister?LoginTabActive=False&amp;RegisterTabActive=True" class="btn btn-primary btn-lg center-block">REGISTER</a> 

在這種情況下該按鈕將擴大到佔據全部水平空間混合簡單的按鈕。

Answer 1

只需加引導的text-center類的menuArea股利。

BOOTPLY

HTML：

<div class="menubar" style="background-color: #0055b8; color:#ffffff; height: 30px;"> 
    <h3 class="text-center">menu bar title</h3> 
</div> 
<div class="text-center"> 
    <a data-toggle="collapse" href="#topMenu" aria-expanded="false" aria-controls="topMenu"> 
     <span class="chevron_toggleable glyphicon glyphicon-chevron-down"></span> 
    </a> 
</div> 
<div class="collapse" id="topMenu"> 
    <div class="menuArea text-center"> 
      <button id="mybutton" name="mybutton" class="btn btn-primary btn-lg">1</button>&nbsp;&nbsp; 
      <button id="mybutton2" name="mybutton2" class="btn btn-primary btn-lg">2</button>&nbsp;&nbsp; 
      <button id="mybutton3" name="mybutton3" class="btn btn-primary btn-lg">3</button> 
    </div> 
</div> 

Answer 2

在這裏你去，你需要添加 「文本中心」，您menuArea DIV，並從每個刪除 「中心塊」按鈕元素。

http://www.bootply.com/wpAjCqxV3c