How do you take away the underline from an anchor element?

Question

I have tried text-decoration:none !important; but it won't work. Here is my code:

.no {
  text-decoration:none !important;
}

<a href="fmab-no.html" class="no">No, Different</a>

It works here but does not work for my VS code. Is this a bug?

Answer 1

some notes:

• you can use > css selector to give higher priority to the element. for example:

.parent-class > .no { text-decoration:none !important; }

• if you work with frameworks like react,vue or angular, it may be due to the encapsulation feature.

• If the code was written by someone else, it may have used the :before or :after feature in css to create the underline.