/CSS/Css animate border bottom left to right

Css animate border bottom left to right

h1 { color: #666;display:inline-block; margin:0;text-transform:uppercase; }
h1:after {
  display:block;
  content: '';
  border-bottom: solid 3px #019fb6;  
  transform: scaleX(0);  
  transition: transform 250ms ease-in-out;
}
h1:hover:after { transform: scaleX(1); }
h1.fromRight:after{ transform-origin:100% 50%; }
h1.fromLeft:after{  transform-origin:  0% 50%; }

Source: stackoverflow.com

Similar codes

15 votes313 views3 answers
Image rotate with css
CSS
0 vote292 views1 answer
Ssh into docker container ddev
CSS
1 vote301 views1 answer
Import css in thymeleaf
CSS
0 vote312 views1 answer
Css animate border
CSS
86 votes280 views6 answers
Css all caps
CSS
0 vote311 views2 answers
Css hexagon with text inside
CSS
0 vote309 views1 answer
Secondline ellipsis
CSS
0 vote324 views1 answer
Css chamfered corner
CSS
0 vote301 views1 answer
Flex starty
CSS
3 votes303 views3 answers
Add tailwindcss to angular
CSS