vue-router : how to remove underline from router-link

Question

This results in an underlined link:

<li><router-link to="/hello">Hello</router-link></li>

My understanding is that the router-link element generates an a tag.

I've tried these things in the CSS:

router-link{
    text-decoration: none;
}

---

router-link a{
    text-decoration: none;
}

---

router-link a{
    text-decoration: none !important;
}

..but unfortunately none of these work.

Answer 1

Vue component tags don't generate HTML tags.
Look in the DOM inspector to see what HTML tags actually exist.

You need to use regular classnames.