WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You

WebArtz - The Web Design Forum
Welcome to WebArtz, Guest!

WebArtz is a nice place for discussions related to web designing and coding. We help our members to code their own website templates with HTML and CSS. We give them advice on various issues.

To know more about WebArtz Forum, visit the About Us page.

At the moment, you are viewing the forum as a guest. As a guest you can't make post and participate in discussions. You need to register and become a member of the forum. Click the register link below and become a part of this forum.

Thank You


You are not connected. Please login or register

View previous topic View next topic Go down  Message [Page 1 of 1]

1What is the names for Profile icons Empty What is the names for Profile icons Mon Nov 29, 2010 6:22 pm

Matti

Matti
Registered Member
Registered Member
Hi, guys

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

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

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



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

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


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

.i_icon_pm:hover{background: url(https://i.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..

http://csshelp.forumotion.net/

2What is the names for Profile icons Empty Re: What is the names for Profile icons Mon Nov 29, 2010 7:41 pm

Guest


Guest
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 (:

3What is the names for Profile icons Empty Re: What is the names for Profile icons Mon Nov 29, 2010 11:00 pm

Matti

Matti
Registered Member
Registered Member
I don't get what are you saying.

But when i use

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

.i_icon_pm:hover{background: url(https://i.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(https://i.servimg.com/u/f62/14/52/65/41/maile11.png) no-repeat center !important;}

.i_icon_email:hover{background: url(https://i.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.

http://csshelp.forumotion.net/

4What is the names for Profile icons Empty Re: What is the names for Profile icons Mon Nov 29, 2010 11:34 pm

ankillien

ankillien
Administrator
Administrator
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

5What is the names for Profile icons Empty Re: What is the names for Profile icons Mon Nov 29, 2010 11:39 pm

Guest


Guest
Correct Very Happy

6What is the names for Profile icons Empty Re: What is the names for Profile icons Tue Nov 30, 2010 1:13 am

Matti

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

http://csshelp.forumotion.net/

7What is the names for Profile icons Empty Re: What is the names for Profile icons Tue Nov 30, 2010 10:48 am

ankillien

ankillien
Administrator
Administrator
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.

8What is the names for Profile icons Empty Re: What is the names for Profile icons Fri Dec 10, 2010 8:13 pm

Guest


Guest
Or->
Code:

img[src="image link here"]

9What is the names for Profile icons Empty Re: What is the names for Profile icons Sat Dec 11, 2010 3:17 am

Guest


Guest
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! Very Happy

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

10What is the names for Profile icons Empty Re: What is the names for Profile icons Mon Dec 13, 2010 9:30 pm

Guest


Guest
I got it Very Happy

First we make a transparent image the same as the website icons:
here is one: https://2img.net/r/ihimizer/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

11What is the names for Profile icons Empty Re: What is the names for Profile icons Tue Dec 14, 2010 3:04 am

Guest


Guest
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! Very Happy

12What is the names for Profile icons Empty Re: What is the names for Profile icons Tue Dec 14, 2010 3:15 am

Matti

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

http://csshelp.forumotion.net/

13What is the names for Profile icons Empty Re: What is the names for Profile icons Tue Dec 14, 2010 3:28 am

Guest


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

Welcome Maki (:

14What is the names for Profile icons Empty Re: What is the names for Profile icons Tue Dec 14, 2010 6:00 pm

Jophy

Jophy
Registered Member
Registered Member
Solved => Closed

http://www.socialtechforum.com/

Sponsored content


View previous topic View next topic Back to top  Message [Page 1 of 1]

Permissions in this forum:
You cannot reply to topics in this forum