0

my question is almost exactly the same as: How do I get this CSS text-decoration override to work?. But I see that the question is 7 years old and I wonder if we have any method of achieving this now?

Basically I have a structure which looks like this:

<a href='abc'>
  This is underlined <span>But not this.</span>
 </a>
  

I want only the text under span to not be underlined. I understand that I can use border bottom and achieve this. Or remove underline from the a tag and insert the text which I want underlined in a span.

I just want to know if there is a way now after 7 years to override text-decoration: underline in a child element.

Community
  • 1
  • 1
Yathi
  • 1,011
  • 1
  • 12
  • 21
  • If you want to attract new answers to an old question, consider posting a bounty on it. Don't ask a duplicate question. – Quentin Jan 18 '17 at 19:14
  • @Quentin: Even if the question has an answer which is accepted? I am not sure how bounties work. Excuse my ignorance. I would also not want to loose my reputation and I think this is a fair question. – Yathi Jan 18 '17 at 19:16

1 Answers1

-1

Use css to achieve what you want.

a span {
    text-decoration: none !important;
    display: inline-block;
}
<a href='abc'>
  This is underlined <span>But not this.</span>
 </a>
Binod Gurung
  • 453
  • 4
  • 12
  • 1
    I am sorry if I misunderstood your question. But I thought you wanted to Underline the `this is underlined` text and remove underline from `but not this` text – Binod Gurung Jan 18 '17 at 19:24
  • @Yathi Have you tried this? It does work. You can see that in the snippet, too. – Dan Jan 18 '17 at 19:33
  • @sh0ber: Yes. It does work for the snippet which I find even more confusing. But on my html it behaves like how it is mentioned in the original question on my post, even with the `!important` tag. I also tried applying the styles on the `element.style` in chrome. Still no go and I have the underline. Its going to be hard to convince otherwise so I am going to abandon this for now. – Yathi Jan 18 '17 at 21:00
  • @BinodGurung: I am sorry! You did understand me correctly. But I can assure that it is for some reason not working in my code even though it seems to work in your snippet. I would have deleted this whole question if SO allowed me to. Sorry for wasting your times. – Yathi Jan 18 '17 at 21:01
  • @Yathi in your code, does the link have a class applied? Check out this answer from the question you linked: http://stackoverflow.com/a/1823378/2185093 – Dan Jan 19 '17 at 02:13