Allow floating label to take full width when floating (scaled down)

This change allows the floating label to expand its width as it's scaled
down because the `width: 100%` as defined in
twbs#36327 will no longer be correct.

scss/_variables.scss

@@ -1000,8 +1000,9 @@ $form-floating-padding-y:         1rem !default;
 $form-floating-input-padding-t:   1.625rem !default;
 $form-floating-input-padding-b:   .625rem !default;
 $form-floating-label-opacity:     .65 !default;
-$form-floating-label-transform:   scale(.85) translateY(-.5rem) translateX(.15rem) !default;
-$form-floating-transition:        opacity .1s ease-in-out, transform .1s ease-in-out !default;
+$form-floating-label-scale:       .85 !default;
+$form-floating-label-transform:   scale($form-floating-label-scale) translateY(-.5rem) translateX(.15rem) !default;
+$form-floating-transition:        opacity .1s ease-in-out, transform .1s ease-in-out, width .1s ease-in-out !default;
 // scss-docs-end form-floating-variables
 
 // Form validation

scss/forms/_floating-labels.scss

@@ -54,13 +54,15 @@
   > .form-control-plaintext,
   > .form-select {
     ~ label {
+      width: 100% / $form-floating-label-scale;
       opacity: $form-floating-label-opacity;
       transform: $form-floating-label-transform;
     }
   }
   // Duplicated because `:-webkit-autofill` invalidates other selectors when grouped
   > .form-control:-webkit-autofill {
     ~ label {
+      width: 100% / $form-floating-label-scale;
       opacity: $form-floating-label-opacity;
       transform: $form-floating-label-transform;
     }