J. A
J. A

Reputation: 37

Text decoration <a> within a <div>

I attached a link to a icon font and I can't seem to figure out how to remove the link styling from it.

Here is a part of it https://jsfiddle.net/bffks6cw/

I've tried

  text-decoration: none;

but it didn't work. I can't seem to figure it out. Any ideas?

Edit:

I did try using .social a { text-decoration: none; }

Here is a pic how it looks.

https://i.sstatic.net/DG2Kb.jpg

Upvotes: 2

Views: 175

Answers (5)

John Louie Dela Cruz
John Louie Dela Cruz

Reputation: 669

Target a instead of the div

EDIT: to keep the icon color put color: inherit

.social a {
    text-decoration: none;
    color: inherit;
}

FIDDLE: https://jsfiddle.net/bffks6cw/7/

Upvotes: 2

Venkat
Venkat

Reputation: 2579

Please Refer this manual for styling links: http://www.w3schools.com/css/css_link.asp

.social a {
  text-decoration: none;
}

Upvotes: 0

Vinod VT
Vinod VT

Reputation: 7159

Add this style,

.social a{
   text-decoration: none;
}

fiddle

Upvotes: 0

eatik
eatik

Reputation: 56

.social a {text-decoration: none;}

this works.

https://jsfiddle.net/bffks6cw/1/

Upvotes: 0

Christian
Christian

Reputation: 19750

If you want to style the anchor, you need to target the anchor.

.social a {
  text-decoration: none;
}

See here: https://jsfiddle.net/bffks6cw/2/

Upvotes: 0

Related Questions