diff --git a/docs/components/forms.md b/docs/components/forms.md
index a4e0addc40..3586f56427 100644
--- a/docs/components/forms.md
+++ b/docs/components/forms.md
@@ -543,7 +543,7 @@ Block help text—for below inputs or for longer lines of help text—can be eas
Password
- Your password must be 8-20 characters long, contain letters and numbers, and must not contain spaces, special characters or emoji.
+ Your password must be 8-20 characters long, contain letters and numbers, and must not contain spaces, special characters or emoji.
{% endexample %}
@@ -607,33 +607,33 @@ Each checkbox and radio is wrapped in a `` for three reasons:
- It provides a helpful and semantic wrapper to help us replace the default ` `s.
- It triggers the state of the ` ` automatically, meaning no JavaScript is required.
-We hide the default ` ` with `opacity` and use the `.c-indicator` to build a new custom form control. We can't build a custom one from just the ` ` because CSS's `content` doesn't work on that element.
+We hide the default ` ` with `opacity` and use the `.custom-control-indicator` to build a new custom form indicator in its place. Unfortunately we can't build a custom one from just the ` ` because CSS's `content` doesn't work on that element.
-With the sibling selector (`~`), we use the `:checked` state to trigger a makeshift checked state on the custom control.
+We use the sibling selector (`~`) for all our ` ` states—like `:checked`—to properly style our custom form indicator. When combined with the `.custom-control-description` class, we can also style the text for each item based on the ` `'s state.
In the checked states, we use **base64 embedded SVG icons** from [Open Iconic](https://useiconic.com/open). This provides us the best control for styling and positioning across browsers and devices.
#### Checkboxes
{% example html %}
-
-
-
- Check this custom checkbox
+
+
+
+ Check this custom checkbox
{% endexample %}
Custom checkboxes can also utilize the `:indeterminate` pseudo class when manually set via JavaScript (there is no available HTML attribute for specifying it).
-
-
-
- Check this custom checkbox
+
+
+
+ Check this custom checkbox
- If you're using jQuery, something like this should suffice:
+If you're using jQuery, something like this should suffice:
{% highlight js %}
$('.your-checkbox').prop('indeterminate', true)
@@ -642,33 +642,52 @@ $('.your-checkbox').prop('indeterminate', true)
#### Radios
{% example html %}
-
-
-
- Toggle this custom radio
+
+
+
+ Toggle this custom radio
-
-
-
- Or toggle this other custom radio
+
+
+
+ Or toggle this other custom radio
{% endexample %}
-#### Stacked
+#### Disabled
-Custom checkboxes and radios are inline to start. Add a parent with class `.c-inputs-stacked` to ensure each form control is on separate lines.
+Custom checkboxes and radios can also be disabled. Add the `disabled` boolean attribute to the ` ` and the `.custom-control-disabled` class to the ``.
{% example html %}
-