Animated Border Bottom From Center on Hover Using CSS
In this CSS tutorial we will create a region / box that will have animated border bottom on mouse hover. The animation will start from center and will move to left and right directions. And when the mouse hover is removed the border will shrink back to center in the same way.
You can use this technique to style your services, projects, features etc. boxes.
Create a box
Let's first create a simple box using HTML and basic CSS.
HTML