Recently, I was working on a project where we had a specific rollover effect in mind. When you hover over the link, the background grows and when you roll off, it returns to its default state. In this video, I'll show you how to do this in CSS and the thought process that went into finding the best method.
0:00 Explanation of the Effect we're trying to achieve
1:06 Coding with text-decoration
3:05 Using border-bottom
4:13 Quick explanation of the box model
4:35 Using a ::before or ::after pseudo-element
8:36 Using box-shadow (the best solution)
🔗 LINKS
+ Codepen using text-decoration
+ Codepen using border-bottom
+ Codepen using a pseudo-element
+ FINAL CODEPEN using box-shadow
👉🏻 Get Updates and Exclusive content at Selfteach.me
💥 SelfTeach.me is a Zeal show