Hi, guys

What's the names for icons from Profile, to Skype

.i_icon_web{width:20px;height:20px;background: url(http://i62.servimg.com/u/f62/14/52/65/41/www12.png) no-repeat center !important;}

.i_icon_web:hover{background: url(http://i62.servimg.com/u/f62/14/52/65/41/www110.png) no-repeat center !important;}



.i_icon_email{width:20px;height:20px;background: url(http://i62.servimg.com/u/f62/14/52/65/41/maile11.png) no-repeat center !important;}

.i_icon_email:hover{background: url(http://i64.servimg.com/u/f64/14/74/84/24/mail10.png) no-repeat center !important;}


.i_icon_pm{width:28px;height:20px;background: url(http://i64.servimg.com/u/f64/14/74/84/24/pm11.png) no-repeat center !important;}

.i_icon_pm:hover{background: url(http://i64.servimg.com/u/f64/14/74/84/24/pm110.png) no-repeat center !important;}

I got the PM icon to work but not the others so can any one list them for me please.

Like this
.i_icon_pm and so on..

Code:


.i_icon_profile

.i_icon_pm

.profile-icon img


There is no CLASS or ID for the links (: like skype, yahoo, msn, email, website (:

I don't get what are you saying.

But when i use

.i_icon_pm{width:28px;height:20px;background: url(http://i64.servimg.com/u/f64/14/74/84/24/pm11.png) no-repeat center !important;}

.i_icon_pm:hover{background: url(http://i64.servimg.com/u/f64/14/74/84/24/pm110.png) no-repeat center !important;}

That worked for the PM icon

And when i use this

.i_icon_email{width:20px;height:20px;background: url(http://i62.servimg.com/u/f62/14/52/65/41/maile11.png) no-repeat center !important;}

.i_icon_email:hover{background: url(http://i64.servimg.com/u/f64/14/74/84/24/mail10.png) no-repeat center !important;}

the email icon it doesn't work/show up so what I'm doing wrong here.

The email one doesn't work because there i no class like i_icon_email.

As far as I know, only 2 class are specified for profile button and PM button...


.i_icon_profile

.i_icon_pm

Correct

Ok i got it only those 2 but how can i make the others.

You can use attribute selectors.

Code:

.postprofile dd a[href^="/profile.forum?mode=email"] img {
...
...
..
}

The above one is for email button. In the same way, you can grab the href values of all other buttons and put them in the above code.

Or->

Code:


img[src="image link here"]


The img[src=] selector will not work in this case because all the images are blank in order to use backgrounds.

Selecting based on the href value is the only CSS-based solution, and that's not going to work for all links. For example, the href in the web link is the actual website, and that changes for every member. If you can come up with a selector that will work for all web links but will not select other links as well, please post it!

The best solution is to use javascript to add classes to each image. That would make the CSS simple.

I got it

First we make a transparent image the same as the website icons:
here is one: http://img707.imageshack.us/img707/9813/wwwmc.png

We add to the pics managements (:

In the CSS we add:

Code:

img[src="http://img707.imageshack.us/img707/9813/wwwmc.png"]{width:20px;height:20px;background: url(http://i62.servimg.com/u/f62/14/52/65/41/www12.png) no-repeat center !important;}

img[src="http://img707.imageshack.us/img707/9813/wwwmc.png"]:hover{background: url(http://i62.servimg.com/u/f62/14/52/65/41/www110.png) no-repeat center !important;}

Demo: http://test1-liqued-coding.forumotion.com/your-first-forum-f1/test-test-test-t2.htm#4

That will definitely work, but you're creating individual blank images. That means each profile icon will now have THREE images: the blank one, the normal background, and the hover background. But since there's only one or two profile icons that will need this, I suppose it's OK. Good work!

FYI...since you created a 20x20 blank image, there's no need for width/height properties in the CSS rule.

I hope after seeing this, the OP realizes it's not worth having hover images on profile icons!

I don't need this anymore so this can be locked thanks for your help guys

U r right dion but yah there is 3-2 icons that don't have ID/Class (:

Welcome Maki (: