I'm not even sure what else to try. I've even put it through a CSS validator and it passes. Works in Chrome and Firefox. Safari shows no warnings or errors that I can tell.
Relevant CSS:
.lines { width: 32px; margin: 20px auto; } .line-bar { display: inline-block; background-color: #f7f7f7; width: 4px; height: 18px; border-radius: 4px; -webkit-animation: loading 1s ease-in-out infinite; animation: loading 1s ease-in-out infinite; } .line-bar:nth-child(1) { } .line-bar:nth-child(2) { -webkit-animation-delay: 0.09s; animation-delay: 0.09s; } .line-bar:nth-child(3) { -webkit-animation-delay: 0.18s; animation-delay: 0.18s; } .line-bar:nth-child(4) { -webkit-animation-delay: 0.27s; animation-delay: 0.27s; } @-webkit-keyframes loading { 0% { transform: scale(1); } 20% { transform: scale(1, 2.2); } 40% { transform: scale(1); } } @keyframes loading { 0% { transform: scale(1); } 20% { transform: scale(1, 2.2); } 40% { transform: scale(1); } } 
