Add margin below check boxes in the vertical layout

README.md

@@ -92,7 +92,7 @@ This generates the following HTML:
     <label class="form-label" for="user_password">Password</label>
     <input class="form-control" id="user_password" name="user[password]" type="password">
   </div>
-  <div class="form-check">
+  <div class="form-check mb-3">
     <input autocomplete="off" name="user[remember_me]" type="hidden" value="0">
     <input class="form-check-input" id="user_remember_me" name="user[remember_me]" type="checkbox" value="1">
     <label class="form-check-label" for="user_remember_me">Remember me</label>
@@ -154,7 +154,7 @@ This generates:
     <input class="form-control" id="user_password" name="user[password]" type="password">
     <small class="form-text text-muted">A good password should be at least six characters long</small>
   </div>
-  <div class="form-check">
+  <div class="form-check mb-3">
     <input autocomplete="off" name="user[remember_me]" type="hidden" value="0">
     <input class="form-check-input" id="user_remember_me" name="user[remember_me]" type="checkbox" value="1">
     <label class="form-check-label" for="user_remember_me">Remember me</label>
@@ -571,7 +571,7 @@ This generates:
   <small class="form-text text-muted">Optional Help Text</small>
 </div>
 <div class="mb-3">
-  <div class="form-check">
+  <div class="form-check mb-3">
     <input autocomplete="off" name="user[terms]" type="hidden" value="0">
     <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1">
     <label class="form-check-label" for="user_terms">I agree to the Terms of Service</label>
@@ -595,7 +595,7 @@ This generates:
 ```html
 <div class="mb-3">
   <label class="form-label" for="user_terms">Optional Label</label>
-  <div class="form-check">
+  <div class="form-check mb-3">
     <input autocomplete="off" name="user[terms]" type="hidden" value="0">
     <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1">
     <label class="form-check-label" for="user_terms">
@@ -664,7 +664,7 @@ To render checkboxes as switches with Bootstrap 4.2+, use `switch: true`:
 This generates:
 
 ```html
-<div class="form-check form-switch">
+<div class="form-check mb-3 form-switch">
   <input autocomplete="off" name="user[remember_me]" type="hidden" value="0">
   <input class="form-check-input" id="user_remember_me" name="user[remember_me]" type="checkbox" value="1">
   <label class="form-check-label" for="user_remember_me">Remember me</label>
@@ -972,7 +972,7 @@ This generates:
     <label class="form-label visually-hidden mr-sm-2" for="user_password">Password</label>
     <input class="form-control" id="user_password" name="user[password]" type="password">
   </div>
-  <div class="form-check form-check-inline">
+  <div class="form-check form-check-inline mb-3">
     <input autocomplete="off" name="user[remember_me]" type="hidden" value="0">
     <input class="form-check-input" id="user_remember_me" name="user[remember_me]" type="checkbox" value="1">
     <label class="form-check-label" for="user_remember_me">Remember me</label>
@@ -1217,7 +1217,7 @@ This generates:
     <label class="form-label" for="user_password">Password</label>
     <input class="form-control" id="user_password" name="user[password]" type="password">
   </div>
-  <div class="form-check">
+  <div class="form-check mb-3">
     <input autocomplete="off" name="user[remember_me]" type="hidden" value="0">
     <input class="form-check-input" custom="true" id="user_remember_me" name="user[remember_me]" type="checkbox" value="1">
     <label class="form-check-label" for="user_remember_me">Remember me</label>

lib/bootstrap_form/inputs/check_box.rb

@@ -66,6 +66,7 @@ def check_box_label_class(options)
       def check_box_wrapper_class(options)
         classes = ["form-check"]
         classes << "form-check-inline" if layout_inline?(options[:inline])
+        classes << "mb-3" unless options[:multiple] || layout == :horizontal
         classes << "form-switch" if options[:switch]
         classes << options[:wrapper_class] if options[:wrapper_class].present?
         classes.flatten.compact

test/bootstrap_checkbox_test.rb

@@ -7,7 +7,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box is wrapped correctly" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="user_terms">
@@ -20,7 +20,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box empty label" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="user_terms">&#8203;</label>
@@ -32,7 +32,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "disabled check_box has proper wrapper classes" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" disabled="disabled" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" disabled="disabled" />
         <label class="form-check-label" for="user_terms">
@@ -45,7 +45,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box label allows html" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="user_terms">
@@ -58,7 +58,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box accepts a block to define the label" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="user_terms">
@@ -71,7 +71,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box accepts a custom label class" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label btn" for="user_terms">
@@ -84,7 +84,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box 'id' attribute is used to specify label 'for' attribute" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="custom_id" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="custom_id">
@@ -97,7 +97,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box responds to checked_value and unchecked_value arguments" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="no" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="yes" />
         <label class="form-check-label" for="user_terms">
@@ -110,7 +110,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "inline checkboxes" do
     expected = <<~HTML
-      <div class="form-check form-check-inline">
+      <div class="form-check form-check-inline mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="user_terms">
@@ -125,7 +125,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
     expected = <<~HTML
       <form accept-charset="UTF-8" action="/users" class="new_user col-auto g-3" id="new_user" method="post">
       #{'<input name="utf8" type="hidden" value="&#x2713;"/>' unless ::Rails::VERSION::STRING >= '6'}
-        <div class="form-check form-check-inline">
+        <div class="form-check form-check-inline mb-3">
           <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
           <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
           <label class="form-check-label" for="user_terms">
@@ -142,7 +142,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "disabled inline check_box" do
     expected = <<~HTML
-      <div class="form-check form-check-inline">
+      <div class="form-check form-check-inline mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" disabled="disabled" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" disabled="disabled" />
         <label class="form-check-label" for="user_terms">
@@ -156,7 +156,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "inline checkboxes with custom label class" do
     expected = <<~HTML
-      <div class="form-check form-check-inline">
+      <div class="form-check form-check-inline mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label btn" for="user_terms">
@@ -498,7 +498,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box skip label" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input position-static" id="user_terms" name="user[terms]" type="checkbox" value="1" />
       </div>
@@ -508,7 +508,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check_box hide label" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input position-static" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label visually-hidden" for="user_terms">I agree to the terms</label>
@@ -580,7 +580,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
     expected = <<~HTML
       <form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post">
         #{'<input name="utf8" type="hidden" value="&#x2713;"/>' unless ::Rails::VERSION::STRING >= '6'}
-        <div class="form-check">
+        <div class="form-check mb-3">
           <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
           <input class="form-check-input is-invalid" id="user_terms" name="user[terms]" type="checkbox" value="1" />
           <label class="form-check-label" for="user_terms">
@@ -598,7 +598,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "check box with custom wrapper class" do
     expected = <<~HTML
-      <div class="form-check custom-class">
+      <div class="form-check mb-3 custom-class">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="user_terms">
@@ -611,7 +611,7 @@ class BootstrapCheckboxTest < ActionView::TestCase
 
   test "inline check box with custom wrapper class" do
     expected = <<~HTML
-      <div class="form-check form-check-inline custom-class">
+      <div class="form-check form-check-inline mb-3 custom-class">
         <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
         <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
         <label class="form-check-label" for="user_terms">

test/bootstrap_fields_test.rb

@@ -260,7 +260,7 @@ class BootstrapFieldsTest < ActionView::TestCase
 
   test "check_box fields are wrapped correctly" do
     expected = <<~HTML
-      <div class="form-check">
+      <div class="form-check mb-3">
         <input #{autocomplete_attr} name="user[misc]" type="hidden" value="0"/>
         <input class="form-check-input" id="user_misc" name="user[misc]" type="checkbox" value="1"/>
         <label class="form-check-label" for="user_misc">Misc</label>
@@ -271,7 +271,7 @@ class BootstrapFieldsTest < ActionView::TestCase
 
   test "switch-style check_box fields are wrapped correctly" do
     expected = <<~HTML
-      <div class="form-check form-switch">
+      <div class="form-check mb-3 form-switch">
         <input #{autocomplete_attr} name="user[misc]" type="hidden" value="0"/>
         <input class="form-check-input" id="user_misc" name="user[misc]" type="checkbox" value="1"/>
         <label class="form-check-label" for="user_misc">Misc</label>

test/bootstrap_form_test.rb

@@ -24,7 +24,7 @@ class BootstrapFormTest < ActionView::TestCase
             <input class="form-control" id="user_email" name="user[email]" type="email" value="[email protected]" />
           </div>
         </div>
-        <div class="form-check">
+        <div class="form-check mb-3">
           <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
           <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
           <label class="form-check-label" for="user_terms">I agree to the terms</label>
@@ -74,7 +74,7 @@ class BootstrapFormTest < ActionView::TestCase
           <label class="form-label mr-sm-2 required" for="user_email">Email</label>
           <input class="form-control" id="user_email" name="user[email]" type="email" value="[email protected]" />
         </div>
-        <div class="form-check form-check-inline">
+        <div class="form-check form-check-inline mb-3">
           <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
           <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
           <label class="form-check-label" for="user_terms">I agree to the terms</label>
@@ -136,7 +136,7 @@ class BootstrapFormTest < ActionView::TestCase
           <label class="form-label mr-sm-2 required" for="user_email">Email</label>
           <input class="form-control" id="user_email" name="user[email]" type="email" value="[email protected]" />
         </div>
-        <div class="form-check form-check-inline">
+        <div class="form-check form-check-inline mb-3">
           <input #{autocomplete_attr} name="user[terms]" type="hidden" value="0" />
           <input class="form-check-input" id="user_terms" name="user[terms]" type="checkbox" value="1" />
           <label class="form-check-label" for="user_terms">I agree to the terms</label>
@@ -412,7 +412,7 @@ class BootstrapFormTest < ActionView::TestCase
     expected = <<~HTML
       <form accept-charset="UTF-8" action="/users" method="post">
         #{'<input name="utf8" type="hidden" value="&#x2713;"/>' unless ::Rails::VERSION::STRING >= '6'}
-        <div class="form-check">
+        <div class="form-check mb-3">
           <input class="form-check-input" id="#{id}" name="#{name}" type="checkbox" value="1" />
           <input #{autocomplete_attr} name="#{name}" type="hidden" value="0" />
           <label class="form-check-label" for="#{id}"> Misc</label>