The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › CSS › How to change the properties of an underline in CSS?
Here’s my code: http://codepen.io/anon/pen/ZOGjNP
Let’s say I want to the change the height of underline in CSS to 5px… how would I do that?
I tried doing ” ::underline {} ” since it works with the ‘selection’, but it didn’t work.
If you want a “special” underline (color, thickness, type of line), you shouldn’t use “text-decoration”, but rather give it a bottom border.
For example, just “border-bottom: solid 5px #ff0000;”
http://codepen.io/senff/pen/NrqLPz
This worked for me:
a:hover { color: rgba(177, 22, 35, 1); border-bottom: 5px solid rgba(177, 22, 35, 1); }
LOL Senff beat me to it
For the record there is a new CSS property text-decoration-style which would do this.
text-decoration-style
Unfortunately, it’s only really available in FF and behind an experimental flag in Chrome.
http://caniuse.com/#feat=text-decoration