Fix wrapping bug (#30345)

diff --git a/scss/_reboot.scss b/scss/_reboot.scss
index b5fc6f101348b37a634fc32532dab6b1d47df0db..4a1a16437cd1c3c0b5a7c7dff65f6f520bc53a6f 100644 (file)
--- a/scss/_reboot.scss
+++ b/scss/_reboot.scss
@@ -500,8 +500,11 @@ fieldset {
   border: 0; // 2
 }
 
-// 1. By using `float: left`, the legend will behave like a block element
+// 1. By using `float: left`, the legend will behave like a block element.
+//    This way the border of a fieldset wraps around the legend if present.
 // 2. Correct the text wrapping in Edge.
+// 3. Fix wrapping bug.
+//    See https://github.com/twbs/bootstrap/issues/29712
 
 legend {
   float: left; // 1
@@ -512,6 +515,10 @@ legend {
   font-weight: $legend-font-weight;
   line-height: inherit;
   white-space: normal; // 2
+
+  + * {
+    clear: left; // 3
+  }
 }
 
 // Fix height of inputs with a type of datetime-local, date, month, week, or time