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

You can try targeting the list item link like this:

li a {
    text-decoration: none;
}