引導程序複選框未對齊，形式爲

Question

檢出this。 此簽名表單中的複選框不合適。 這裏是我的views/devise/new.html.erb：

<div class="panel panel-default"> 
    <div class="panel-heading"> 
    <div class="panel-title"> 
     <h1>Sign in</h1> 
    </div> 
    </div> 
    <div class="panel-body"> 
    <%= form_for(resource, :as => resource_name, :url => session_path(resource_name)) do |f| %> 

     <div class="form-group"> 
      <%= f.label :email %> 
      <%= f.email_field :email, class: "form-control", :autofocus => true %> 
     </div> 

     <div class="form-group"> 
      <%= f.label :password %> 
      <%= f.password_field :password, class: "form-control" %> 
     </div> 

     <div class="form-group"> 
      <div class="checkbox"> 
      <%= f.check_box :remember_me %> 
      <%= f.label :remember_me %> 
      </div> 
     </div> 

     <div class="form-group"> 
      <%= f.submit "Sign in", class: "btn btn-primary" %> 
     </div> 
    <% end %> 
    </div> 
    <div class="panel-footer"> 
    <%= render "devise/shared/links" %> 
    </div> 
</div> 

HTML格式的代碼（如通過檢查該鏈接元素）：

<form accept-charset="UTF-8" action="https://stackoverflow.com/users/sign_in" class="new_user" id="new_user" method="post"><div style="display:none"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="hJoDW6L9ixCxHihStggbY4U4iPcoyD6QRSVg2+rcCbA="></div> 

     <div class="form-group"> 
      <label for="user_email">Email</label> 
      <input autofocus="autofocus" class="form-control" id="user_email" name="user[email]" type="email" value=""> 
     </div> 

     <div class="form-group"> 
      <label for="user_password">Password</label> 
      <input class="form-control" id="user_password" name="user[password]" type="password"> 
     </div> 

     <div class="form-group"> 
      <div class="checkbox"> 
      <input name="user[remember_me]" type="hidden" value="0"><input id="user_remember_me" name="user[remember_me]" type="checkbox" value="1"> 
      <label for="user_remember_me">Remember me</label> 
      </div> 
     </div> 

     <div class="form-group"> 
      <input class="btn btn-primary" name="commit" type="submit" value="Sign in"> 
     </div> 
</form> 

我面臨着類似的問題與對齊在其他項目中，以及複選框（對不起！我是bootstrap的新手）。任何幫助是非常需要的！

Answer 1

引導複選框Strucutre應該像波紋管：

<div class="checkbox"> 
    <label> 
     <input type="checkbox" ... > Label text 
    </label> 
</div> 

編輯： 或者你可以讓你的結構和比你可以做這樣的事情：下一個

/* add this to your CSS */ 

.radio input[type="radio"], 
.radio-inline input[type="radio"], 
.checkbox input[type="checkbox"], 
.checkbox-inline input[type="checkbox"] { 
     margin-left: 0; 
    }