Bootstrap submit button not aligning within form on non-mobile devices - ruby-on-rails

Question

Within my rails form: I am using form-horizontal. I can't seem to figure out how to line my submit button up within my form.
The submit button does line up when accessing the form from a mobile devise:
But the submit button is not aligned when accessing the form from a tablet/computer:
Here is my code for the form:
Search Providers
<%= form_tag providers_index_search_results_path, {class: 'form-horizontal'} do |f| %>
<div class="form-group">
<%= label_tag :title, nil, class: "control-label col-sm-2" %>
<div class="col-sm-5">
<%= text_field_tag :title, nil, class: "form-control col-sm-5" %>
</div>
</div>
<div class="form-group">
<%= label_tag :name, nil, class: "control-label col-sm-2" %>
<div class="col-sm-5">
<%= text_field_tag :name, nil, class: "form-control col-sm-5" %>
</div>
<div class="col-sm-5"></div>
</div>
<%= button_tag('Submit', class: "btn btn-primary") %>
<% end %>
How can I make it so that the submit button lines up?

Answer 1

You have to put your button inside of a div.form-group, and subsequently in the grid.
Here is the example from the bootstrap docs:
<form class="form-horizontal">
<div class="form-group">
<label for="inputEmail3" class="col-sm-2 control-label">Email</label>
<div class="col-sm-10">
<input type="email" class="form-control" id="inputEmail3" placeholder="Email">
</div>
</div>
<div class="form-group">
<label for="inputPassword3" class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
<input type="password" class="form-control" id="inputPassword3" placeholder="Password">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<div class="checkbox">
<label>
<input type="checkbox"> Remember me
</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default">Sign in</button>
</div>
</div>
</form>
Always check the docs first: http://getbootstrap.com/css/#forms-horizontal