This is T78304: Symbols on Special:AbuseFilter/test and Special:AbuseFilter/examine appears misalignated, take 2, with MonoBook Skin.

Environment

• WMF Meta-Wiki
• MonoBook skin
• Go to https://meta.wikimedia.org/wiki/Special:AbuseFilter/test (no need to actually load a filter and test it to reproduce this issue)
  • in search options enter your user name in the changes by user field
  • Mark the checkbox "show changes that do not match the filter"
  • Hit the Test button

Actual results:

Icons overlap with text:

Expected results:
modules/ext.abuseFilter.css$160 left-padding: 25px; respected to avoid the icon-text overlap.

Possible cause

As far as I can see the console inspector MonoBook's .special li is overriding the extension CSS by forcing a padding: 0;

Each line in Special:AbuseFilter/test is a <li class=... and MonoBook's .special li is:

body.skin--responsive .special li {
	line-height: 1.4em;
	margin: 0;
	padding: 0;
}

This also happens with MonoBook Skin not in responsive mode too.

I managed to fix this for myself by adding a !important; to my global.css page, but this should be fixed for all users.

Not sure if this is to be fixed in AbuseFilter or MonoBook though.

Thanks.