Mike Mike - 4 months ago 36
CSS Question

Different color for underline then font

Is there a way to make different color for underline of text then text itself?

It seems that

is not available on most browsers. So is there other way?


Use border-bottom, and text-decoration: none. It seems same as underlined link.

Have a look at the snippet below:

a {
  text-decoration: none;
  color: red;
  border-bottom: 1px solid blue;

a:hover {
  color: blue;
  border-color: red;
<a href="#">This is a underlined link</a>

Hope this helps!