JSFiddle - React, Tailwind, and code Playground

by Chris Nicholson

HTML

<ul>
    <li><a href="#">hello world</a></li>
    <li><a href="#">hello world</a></li>
</ul>

CSS

li a {
    display: block;
    width: 300px;
    background: pink;
    text-decoration: none;
    
    -webkit-animation-name: rotateThis;
    -webkit-animation-duration:0.4s;
    -webkit-animation-iteration-count:infinite;
    -webkit-animation-timing-function:linear;

}

@-webkit-keyframes rotateThis {
    from { 
        width: 300px;
    }
    to { 
        width: 350px;
    -webkit-animation-name: rotateThisBack;
            -webkit-animation-duration:0.4s;
            -webkit-animation-iteration-count:infinite;
            -webkit-animation-timing-function:linear;
    }
}
@-webkit-keyframes rotateThisBack {
    from { 
        width: 350px;
    }
    to { 
        width: 300px;
            
    }
}