A Better Underline Transition

Saw this on an e-com form that worked REALLY well. It even handled the line break 👍

span {
	background-repeat: no-repeat;
	background-size: 0 2px;
	background-image: linear-gradient(to right,#000 0,#000 100%);
	-webkit-transition: background-size .55s cubic-bezier(.2,.75,.5,1);
	transition: background-size .55s cubic-bezier(.2,.75,.5,1);
	background-position: left bottom;
}

span:hover {
	background-size: 100% 2px;
}

(must target inline element)