Search code examples
csstext-decorations

CSS text-decoration underline color


Possible Duplicate:
Changing Underline color

It's possible to change only line color which is under text? I would like to see something like red letters with a blue line below it, but I can't find out how to get this done.


Solution

  • (for fellow googlers, copied from duplicate question) This answer is outdated since text-decoration-color is now supported by most modern browsers.

    You can do this via the following CSS rule as an example:

    text-decoration-color:green


    If this rule isn't supported by an older browser, you can use the following solution:

    Setting your word with a border-bottom:

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