Css 引导列嵌套继承了主列样式

我正在为我的登录页面构建一个布局，但在让按钮对齐时遇到了问题。我使用了一个自定义类来集中我的用户名和密码表单，现在我想在下面有两个大小相等的按钮用于登录和注册。我试着用col实现这一点，col的大小是父级的一半，但到目前为止，它们的大小还是一样的。任何关于我做错了什么的帮助都是感激的

html:

---

我试图设置一个提琴，但ofc它不能与rails标签一起使用…

找到了它，丢失了一个

-

，不得不将它们贴在主柱外，并向中心偏移。以下是最终结果：

<div class="col-xs-4 centered">
        <%= form_tag sessions_path do %>
        <div class="form-group">

        <%= label_tag :email %>
        <%= text_field_tag :email, params[:email], class:'form-control' %><br/>

        <%= label_tag :password %>
        <%= password_field_tag :password, nil, class:'form-control' %><br/>
        </div>
</div>
        <div class="col-xs-2 col-xs-offset-4">
        <%= submit_tag "Log in", class:'btn btn-primary btnstyle' %>
        </div>
        <div class="col-xs-2">
        <%= link_to 'Sign Up', new_user_path, class:'btn btn-primary btnstyle' %>
        </div>
        <% end %>
        </div>

.btnstyle {
    width:100%;
}

.centered  {
    float: none;
    margin: 0 auto;
}

<div class="col-xs-4 centered">
        <%= form_tag sessions_path do %>
        <div class="form-group">

        <%= label_tag :email %>
        <%= text_field_tag :email, params[:email], class:'form-control' %><br/>

        <%= label_tag :password %>
        <%= password_field_tag :password, nil, class:'form-control' %><br/>
        </div>
</div>
        <div class="col-xs-2 col-xs-offset-4">
        <%= submit_tag "Log in", class:'btn btn-primary btnstyle' %>
        </div>
        <div class="col-xs-2">
        <%= link_to 'Sign Up', new_user_path, class:'btn btn-primary btnstyle' %>
        </div>
        <% end %>
        </div>