Fixed #36807 -- Fixed form field alignment under <fieldset> in the admin.

It isn't safe to set display: flex on <fieldset>, because on Safari this
interferes with display: block on child divs.

Thanks Paulo Coutinho for the report and Antoliny for the review.

Regression in 4187da258fe212d494cb578a0bc2b52c4979ab95.

4 files changed, 8 insertions, 8 deletions

diff --git a/django/contrib/admin/static/admin/css/forms.css b/django/contrib/admin/static/admin/css/forms.css
index 76e2d493e9..6d13d43350 100644
--- a/django/contrib/admin/static/admin/css/forms.css
+++ b/django/contrib/admin/static/admin/css/forms.css
@@ -102,7 +102,7 @@ fieldset .inline-heading,
 }
 
 .aligned legend {
-    float: left;
+    float: inline-start;
 }
 
 .aligned legend,
@@ -148,15 +148,11 @@ form .aligned ul {
 }
 
 form .aligned div.radiolist {
-    display: inline-block;
+    display: block;
     margin: 0;
     padding: 0;
 }
 
-form .aligned fieldset div.help {
-    margin-left: 0;
-}
-
 form .aligned p.help,
 form .aligned div.help {
     margin-top: 0;
diff --git a/django/contrib/admin/static/admin/css/responsive.css b/django/contrib/admin/static/admin/css/responsive.css
index fbf0d88b40..93abf79953 100644
--- a/django/contrib/admin/static/admin/css/responsive.css
+++ b/django/contrib/admin/static/admin/css/responsive.css
@@ -560,6 +560,10 @@ input[type="submit"], button {
         margin-top: 5px;
     }
 
+    form .aligned fieldset div.flex-container {
+        display: unset;
+    }
+
     /* Related widget */
 
     .related-widget-wrapper {
diff --git a/django/contrib/admin/templates/admin/auth/user/change_password.html b/django/contrib/admin/templates/admin/auth/user/change_password.html
index 08d191b765..d3e546d28d 100644
--- a/django/contrib/admin/templates/admin/auth/user/change_password.html
+++ b/django/contrib/admin/templates/admin/auth/user/change_password.html
@@ -40,7 +40,7 @@
 
 <div class="form-row">
   {{ form.usable_password.errors }}
-  <fieldset class="flex-container">{{ form.usable_password.legend_tag }} {{ form.usable_password }}</fieldset>
+  <fieldset>{{ form.usable_password.legend_tag }} {{ form.usable_password }}</fieldset>
   {% if form.usable_password.help_text %}
   <div class="help"{% if form.usable_password.id_for_label %} id="{{ form.usable_password.id_for_label }}_helptext"{% endif %}>
     <p>{{ form.usable_password.help_text|safe }}</p>
diff --git a/django/contrib/admin/templates/admin/includes/fieldset.html b/django/contrib/admin/templates/admin/includes/fieldset.html
index aa8d94b41d..1fd303ea82 100644
--- a/django/contrib/admin/templates/admin/includes/fieldset.html
+++ b/django/contrib/admin/templates/admin/includes/fieldset.html
@@ -11,7 +11,7 @@
         <div class="form-row{% if line.fields|length == 1 and line.errors %} errors{% endif %}{% if not line.has_visible_field %} hidden{% endif %}{% for field in line %}{% if field.field.name %} field-{{ field.field.name }}{% endif %}{% endfor %}">
             {% if line.fields|length == 1 %}{{ line.errors }}{% else %}<div class="flex-container form-multiline">{% endif %}
             {% for field in line %}
-                {% if field.is_fieldset %}<fieldset class="flex-container"{% if field.field.help_text %} aria-describedby="{{ field.field.id_for_label }}_helptext"{% endif %}>{{ field.label_tag }}{% endif %}
+                {% if field.is_fieldset %}<fieldset{% if field.field.help_text %} aria-describedby="{{ field.field.id_for_label }}_helptext"{% endif %}>{{ field.label_tag }}{% endif %}
                 <div>
                     {% if not line.fields|length == 1 and not field.is_readonly %}{{ field.errors }}{% endif %}
                         <div class="flex-container{% if not line.fields|length == 1 %} fieldBox{% if field.field.name %} field-{{ field.field.name }}{% endif %}{% if not field.is_readonly and field.errors %} errors{% endif %}{% if field.field.is_hidden %} hidden{% endif %}{% endif %}{% if field.is_checkbox %} checkbox-row{% endif %}">