id	summary	reporter	owner	description	type	status	component	version	severity	resolution	keywords	cc	stage	has_patch	needs_docs	needs_tests	needs_better_patch	easy	ui_ux
35404	Admin fieldset multiple flexbox regressions	minusf		"Hello. I have noticed a couple regressions in the admin fieldset css. I think they are all related to switching `<div class=""form-row"">` to flexbox.

1. input type=text boxes on the right side grow in height if the label doesn't fit into 160px.

[[Image(flexbox-input.png)]]

2. long labels have uncovered another issue: incorrect line height and a forced height in general. After applying the following patch:

{{{#!diff
M django/contrib/admin/static/admin/css/forms.css
@@ -84,14 +84,13 @@ form ul.inline li {
     min-width: 160px;
     width: 160px;
     word-wrap: break-word;
-    line-height: 1;
+    line-height: 1.5;
 }
 
 .aligned label:not(.vCheckboxLabel):after {
     content: '';
     display: inline-block;
     vertical-align: middle;
-    height: 1.625rem;
 }
 
 .aligned label + p, .aligned .checkbox-row + div.help, .aligned label + div.readonly {
}}}

long labels looks more readable:

[[Image(long-labels-with-patch.png)]]

3. checkboxes are not aligned with their labels. I don't have a patch for this, only 2 screenshots:

with flexbox:

[[Image(unaligned-checkbox.png)]]

without flexbox:

[[Image(checkbox-wo-flexbox.png)]]"	Bug	closed	contrib.admin	4.2	Normal	fixed	css admin fieldset accessibility	minusf	Accepted	0	0	0	0	0	1