text-decoration: none
Assuming that you have a hyperlink wrapped by a <div> block like the following, and you want to remove the underline of the hyperlink.
<div class='google_link_div'>
<a href='//www.google.com/'>Go to Google</a>
</div>
A common mistake you might make is to add text-decoration: none; directly under the outside <div> like this:
.google_link_div {
...
text-decoration: none;
}
This does not work.
Solution
To remove the underlines from links, you must set text-decoration to none under <a> (Anchor tag) to suppress the default style.
.google_link_div a {
...
text-decoration: none;
}
Or for all hyperlinks:
a {
...
text-decoration: none;
}