基于按钮大小的引导文本对齐

Question

我目前正在尝试浏览文档，但似乎在某些事情上遇到了死胡同。我很好奇是否有一种方法可以在按钮等的大小级别上构建文本对齐，而无需将按钮拉入单独的 div。

例如，文本对齐最好在 md 和 lg 处左右对齐，这样按钮并排并与其余文本居中。但为了让它卡入到位，我能找到的唯一解决方法是创建一组额外的按钮，这些按钮为平板电脑 sm 和手机 xs 隐藏。

所以我目前的工作是这样，但如果可能的话，我想把它保留在一组按钮上。想法？

<div class="row">
    <div class="clearfix visible-xs visible-sm text-center">
        <div class="col-sm-12 col-xs-12 mrg-B-lg">
            <div class="btn btn-primary btnChangeLogin" onClick="submitForm('changeLogin')">
                Change Login

           </div>
        </div>   
        <div class="col-sm-12 col-xs-12 text-center">
            <div class="btn btn-secondary btnLogOut" onClick="submitForm('logout')">
                Logout
            </div>
        </div>
    </div>
    <div class="clearfix hidden-xs hidden-sm text-center">
        <div class="col-md-6 col-lg-6">

            <div class="btn btn-primary btnChangeLogin" onClick="submitForm('changeLogin')">
                Change Login
            </div>
        </div>   
        <div class="col-md-6 col-lg-6">
            <div  class="btn btn-secondary btnLogOut" onClick="submitForm('log-out')">
                Logout
            </button>
        </div>
    </div>
</div>

Answer 1

尝试在按钮组中这样做：http://getbootstrap.com/components/#btn-groups