在所有行上拉伸 4 bootstrap 个按钮

Question

<div class="row">
    <div class="col-md-6 col-sm-8 col-xs-12">
        <a class="btn btn-default" id="lnkBtnSave" onclick=" GetSaveData(); ">Save</a>
        <a class="btn btn-default" id="lnkBtnSubmit" onclick=" GetSubmitData(); ">Submit</a>
        <asp:LinkButton class="btn btn-default" id="lnkBtnAttach" runat="server" OnClick="lnkBtnAttach_OnClick" Text="Attach" ></asp:LinkButton>
        <asp:LinkButton class="btn btn-default" id="lnkBtnExit" runat="server" OnClick="lnkBtnExit_OnClick" Text="Exit"></asp:LinkButton>
    </div>
</div>

我一排有 4 个按钮。我怎样才能在所有行上拉伸这个按钮？目前它看起来像：

我想要的是这样的：

Answer 1

在它们每个周围添加一个 div 并为其指定您想要的尺寸。刚才在我的网站上试过了，我有四个按钮横跨整个页面。

  <div class="row">   
    <div class="col-md-3 col-sm-3 col-xs-6 text-center">
        <a class="btn btn-default" id="lnkBtnSave" onclick=" GetSaveData(); ">Save</a>
    </div>
    <div class="col-md-3 col-sm-3 col-xs-6 text-center">
        <a class="btn btn-default" id="lnkBtnSubmit" onclick=" GetSubmitData(); ">Submit</a>
    </div>
    <div class="col-md-3 col-sm-3 col-xs-6 text-center">
         <asp:LinkButton class="btn btn-default" id="lnkBtnAttach" runat="server" OnClick="lnkBtnAttach_OnClick" Text="Attach" ></asp:LinkButton>
    </div>
     <div class="col-md-3 col-sm-3 col-xs-6 text-center">
        <asp:LinkButton class="btn btn-default" id="lnkBtnExit" runat="server" OnClick="lnkBtnExit_OnClick" Text="Exit"></asp:LinkButton>
     </div>
 </div>

Answer 2

将每个按钮包裹在 .col-xs-3 div 中，并在 div 上应用 text-align:center：

.row > div {
  text-align:center
}

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
    <div class="col-xs-12">
      <div class="col-xs-3">
        <a class="btn btn-default" id="lnkBtnSave" onclick=" GetSaveData(); ">Save</a>
      </div>
      <div class="col-xs-3">
        <a class="btn btn-default" id="lnkBtnSubmit" onclick=" GetSubmitData(); ">Submit</a>
      </div>
      <div class="col-xs-3">
        <a class="btn btn-default" id="lnkBtnAttach" runat="server" OnClick="lnkBtnAttach_OnClick" Text="Attach" >Attach</a>
      </div>
      <div class="col-xs-3">
        <a class="btn btn-default" id="lnkBtnExit" runat="server" OnClick="lnkBtnExit_OnClick" Text="Exit">Exit</a>
      </div>
    </div>
</div>

在所有行上拉伸 4 bootstrap 个按钮

Stretch 4 bootstrap buttons on all row

html

css

twitter-bootstrap