Changeset 64034

Timestamp:

10/01/2026 07:30:57 PM (11 days ago)

Author:

whyisjake

Message:

Toolbar: Constrain the site icon's size.

The toolbar site icon added in 7.1 is sized only by width and height. A theme or plugin rule such as img { width: auto !important; height: auto !important; } overrides those, and the icon renders at the size of the image file. Add matching max-width, max-height, min-width, and min-height, and qualify the selector with img for added specificity, so the icon stays 20 pixels square, or 28 pixels on small screens.

Follow-up to r62625.

Props donniam, kgagne, khokansardar, jorbin, webverts, adrianduffell, iamchitti, joedolson, sabernhardt, adamsilverstein.
Fixes #65912.

File:

• trunk/src/wp-includes/css/admin-bar.css (modified) (3 diffs)

trunk/src/wp-includes/css/admin-bar.css

@@ -591 +591 @@
 }
 
-#wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon {
+/* The adminbar icon needs additional styling to prevent 3rd party styles from overriding the size. */
+#wpadminbar #wp-admin-bar-site-name > .ab-item img.site-icon {
         width: 20px;
         height: 20px;
+        max-width: 20px;
+        max-height: 20px;
+        min-width: 20px;
+        min-height: 20px;
         border-radius: 2px;
 }
@@ -943 +948 @@
         }
 
-        #wpadminbar #wp-admin-bar-site-name > .ab-item .site-icon {
+        #wpadminbar #wp-admin-bar-site-name > .ab-item img.site-icon {
                 position: absolute;
                 top: 9px;
@@ -949 +954 @@
                 width: 28px;
                 height: 28px;
+                max-width: 28px;
+                max-height: 28px;
+                min-width: 28px;
+                min-height: 28px;
                 margin: 0;
                 border-radius: 4px;