缩小浏览器尺寸时，图像无法适合整个屏幕

Question

我正在尝试使用纯html和css制作滑块，但是当我减小浏览器的尺寸并缩小它时，所有图像下面都有很大的空间。

这是代码：

fiddle

我不确定，但我认为问题出在这里：

.slider figure img{
    height:100% !important;
    width: 20%;
    float: left;
    background-size: cover;        
}