It’s a cool little effect. The default link style has an underline (which is a good idea) and then on
:hover you see the underline essentially thicken up turning into almost what it would have looked liked if you used a
background-color on the link instead.
Here’s an example of the effect on the Superfriendly site:
- The Superfriendly site does it with
box-shadow: inset 0 -0.07em 0 #0078d6;into
box-shadow: inset 0 -0.85em 0
The post Link Underlines That Animate Into Block Backgrounds appeared first on CSS-Tricks.