[wp-trac] [WordPress Trac] #63120: Emojis in plugin titles render in front of text characters

[WordPress Trac]

#63120: Emojis in plugin titles render in front of text characters
-------------------------------------------------+-------------------------
 Reporter:  slimndap                             |       Owner:  (none)
     Type:  defect (bug)                         |      Status:  new
 Priority:  normal                               |   Milestone:  6.9
Component:  Plugins                              |     Version:  6.8
 Severity:  minor                                |  Resolution:
 Keywords:  good-first-bug has-test-info         |     Focuses:  ui, css
  changes-requested dev-feedback                 |
-------------------------------------------------+-------------------------
Changes (by tomd6r):

 * keywords:  good-first-bug has-patch has-test-info => good-first-bug has-
     test-info changes-requested dev-feedback


Comment:

 Hi everyone,

 Thank you all for your hard work on this bug so far.

 There are many ways to “fix” this bug, but to make the best decision, it
 would be helpful to first understand ''why'' the float CSS rule is applied
 to images here.

 The given patch adds an extra class and a more specific selector, but it’s
 difficult to determine what might be broken without knowing the purpose of
 the float rule.

 For example, a more specific solution like the following might be a safer
 and more modern approach:

 {{{
 - .plugins .plugin-title img
 + .plugins .plugin-title img:not(.emoji)
 }}}

 I’ve tested this fix using the suggested method by @ankitkumarshah (thank
 you!).

 If someone could enlighten me about the reason this CSS rule is here in
 the first place, we can decide on the best fix, which might even involve
 deleting the img selector entirely. I’ll then upload a patch.

-- 
Ticket URL: <https://core.trac.wordpress.org/ticket/63120#comment:28>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform