XF 1.5 Remove gradient effect from all prefixes

Amin Sabet

Well-known member
I found this from @Brogan in another thread - it removes the wrapping effect and gradient look from user banners. I like it a lot.

I've removed the wrapping from mine.
This is my EXTRA.css related to banners:
.userBanner {
background: transparent url('@imagePath/xenforo/gradients/category-23px-light.png') repeat-x top;
padding: 1px 4px;
font-size: 10px;
font-weight: bold;
box-shadow: none;

.messageUserBlock .userBanner {
margin-top: 4px;
margin-bottom: 4px !important;
margin-right: 0px !important;
margin-left: 0px !important;
padding: 1px;

.messageUserBlock .userBanner:last-child {
margin-bottom: 0px !important;

.userBanner.wrapped span {
height: 0px;

.xenOverlay.memberCard .cardUserBanner {
margin: 4px 0;

.userBanner.bannerStaff {
background-color: @secondaryMedium;
border-color: @secondaryMedium;
color: @contentBackground;
text-shadow: 1px 1px 1px @secondaryMedium;
The result:
View attachment 55737

Basically the left and right margins and setting the span height to 0px will do it.

Edit: You should use border:none rather than border:"".
Now I'd like to remove the gradient effect from all thread prefixes so they will look similarly "flat". How can I do this?