From 1e6bede076285c9fbafad7ce5a3cb4b1d153e56b Mon Sep 17 00:00:00 2001
From: Sergey Biryukov <sergeybiryukov@git.wordpress.org>
Date: Sat, 13 Nov 2021 04:23:07 +0000
Subject: [PATCH] Twenty Eleven: Improve comment form styling for required
 fields.

Previously, with absolute positioning, the star character to signify required comment form fields could overlap the text in some languages. The star's styling was also inconsistent between the input labels and the comment notes paragraph.

This commit makes the star's styling more consistent and ensures it does not overlap with the text.

Follow-up to [52029].

Props sabernhardt, hellofromTonya.
Fixes #54408.

git-svn-id: https://develop.svn.wordpress.org/trunk@52152 602fd350-edb4-49c9-b593-d223f7449a82
---
 src/wp-content/themes/twentyeleven/rtl.css   |  8 ++++----
 src/wp-content/themes/twentyeleven/style.css | 16 +++++++++++-----
 2 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/src/wp-content/themes/twentyeleven/rtl.css b/src/wp-content/themes/twentyeleven/rtl.css
index 2354d691c5..5241297fc6 100644
--- a/src/wp-content/themes/twentyeleven/rtl.css
+++ b/src/wp-content/themes/twentyeleven/rtl.css
@@ -444,10 +444,10 @@ section.recent-posts .other-recent-posts .comments-link > span {
 	-moz-box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
 	box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
 }
-#respond .comment-form-author .required,
-#respond .comment-form-email .required {
-	left: auto;
-	right: 75%;
+#respond .comment-form label .required {
+	float: left;
+	margin-left: 0;
+	margin-right: 4px;
 }
 #respond .form-submit {
 	float: left;
diff --git a/src/wp-content/themes/twentyeleven/style.css b/src/wp-content/themes/twentyeleven/style.css
index f63975c648..87896c6f75 100644
--- a/src/wp-content/themes/twentyeleven/style.css
+++ b/src/wp-content/themes/twentyeleven/style.css
@@ -2232,14 +2232,20 @@ a.comment-reply-link > span {
 	resize: vertical;
 	width: 95%;
 }
-#respond .comment-form-author .required,
-#respond .comment-form-email .required {
+#respond .comment-form label .required,
+#respond .comment-form .comment-notes .required,
+#respond .comment-form .logged-in-as .required {
 	color: #bd3500;
 	font-size: 22px;
 	font-weight: bold;
-	left: 75%;
-	position: absolute;
-	z-index: 1;
+}
+#respond .comment-form label .required {
+	float: right;
+	margin-left: 4px;
+}
+#respond .comment-form .comment-notes .required,
+#respond .comment-form .logged-in-as .required {
+	vertical-align: middle;
 }
 #respond .comment-notes,
 #respond .logged-in-as {