Css Carousel没有滑动适量

Question

我按照教程制作了一个css轮播，但是图像没有移动正确的数量，我认为它可能是@keyframes的一个问题，但我不确定它需要更改为

Jsfiddle here

@keyframes carousel{
    0%    { left:0; }
    11%   { left:0; }
    12.5% { left:-100%; }
    23.5% { left:-100%; }
    25%   { left:-200%; }
    36%   { left:-200%; }
    37.5% { left:-300%; }
    48.5% { left:-300%; }
    50%   { left:-400%; }
    61%   { left:-400%; }
    62.5% { left:-300%; }
    73.5% { left:-300%; }
    75%   { left:-200%; }
    86%   { left:-200%; }
    87.5% { left:-100%; }
    98.5% { left:-100%; }
    100%  { left:0; }
}

Answer 1

添加此规则：

ul {
  margin: 0;
  padding: 0;
}

Updated Fiddle