use flex and direction to do the stacked controls instead of float hacks

This also fixes #21280. Previously, we were using float and clear on the individual controls, but that meant a computer height of `0` for the parent `.custom-controls-stacked`. No more problem after using flexbox though.

scss/_custom-forms.scss

@@ -114,10 +114,11 @@
 // set. Use these optional classes to tweak the layout.
 
 .custom-controls-stacked {
+  display: flex;
+  flex-direction: column;
+
   .custom-control {
-    float: left;
     margin-bottom: $custom-control-spacer-y;
-    clear: left;
 
     + .custom-control {
       margin-left: 0;