How can I give a specific user a different colored avatar border ("everywhere")?

Hello,

I am currently using this code:

Code:

.postprofile dt a[href="/u###"] img { border-color: #ffffff; }

This changes the color of the border in posts/threads.

How can I change it in all other places (except memberlist)? Like the big avatar in "profile pages", the smaller ones in the "friends section", and in the "users who participated in thread"-section, and so on...

Thanks.

Hello @Friendly Toucan,

The easy way to do is

Code:

a[href="/u###"]:not(.profile-icon) img { border-color: #ffffff; }
#memberlist a[href="/u###"] img { border-width: 0 !important; }

In profile and others parts it's difficult with css

Hey,

Thanks for trying to help, too bad that code didn't really change any additional borders than the code I was already using.

pedxz wrote:In profile and others parts it's difficult with css

"Difficult", meaning it's still possible?

I also tried:

Code:

img[src*="the-user's-avatar.png"] { border-color: #ffffff; }

This also changed the border of the big avatar in the profile page. Still haven't figured out how to do this for the avatars in the "friends section", and the avatars in "who participated in topic"-section.

Friendly Toucan wrote:Thanks for trying to help, too bad that code didn't really change any additional borders than the code I was already using.

Other than the posted code from the first message I don't know what was added. The forum is closed for guests which complicates

pedxz wrote:In profile and others parts it's difficult with css

"Difficult", meaning it's still possible?

Ya by editing template, using a script or do what you have done below and use the image as a reference

This also changed the border of the big avatar in the profile page. Still haven't figured out how to do this for the avatars in the "friends section", and the avatars in "who participated in topic"-section.

Code:

a[href="/u###"] > .avatar > img {
    border-color: red !important;
}

[title="USERNAME"].poster::before {
    border-color: red !important;
}

Replace

Code: USERNAME

by the username

Good afternoon!

1) I suggest using another property:

Code:

img[src="IMAGE LINK"] {
  border: 5px solid red;
}

Result:







2) I can also suggest a way of defining the image with "alt":

Code:

img[alt="Admin"], img[alt="test 1-14"] {
  border: 5px solid red;
}

The 'alt' value of an avatar is either a nickname or a randomly generated value:





You need to check your 'alt' value

The standard border design will have priority in the users list. Otherwise, you can use this code to remove the borders:

Code:

a.tooltipstered img {
  border: none;
}

Hello again,

The border color is now changed in all different avatar locations.

Big thanks to all who helped!

Marking this as "solved".