Rotating Loaders in CSS

Voltori

New Member
First of all, sorry if the title is wrong because I don't know if these are actually called rotating loaders or not. This is what I am talking about: JSFiddleI have 2 problems with these loaders,
  • in .chrome-loader, if I set \[code\]height: 50px; width: 50px;\[/code\], and and in \[code\].ring-maker\[/code\] set \[code\]top: 2.5px; left: 2.5px\[/code\] it doesn't work very well. Does px unit support values upto 2 decimal places? I guess they don't. So what can I do to fix it? I basically want to make it of same size as the ones above. Perhaps, some other unit?
  • For \[code\].win8-loader\[/code\] I set this CSS animation for first dot.\[code\]@-webkit-keyframe win8dot1 { 0% {left: -10px;} 33% {left: 500px;} 66% {left: 780px;} 100% {left: 1280px;}}\[/code\]But it doesn't work. The first dot doesn't even move.
PS: are names like \[code\]abc1-de2\[/code\] allowed for keyframes?
 
Back
Top