图像滑块有不必要的间隙

Question

我有这个图像滑块，滑块下方有几个像素高的不需要的间隙。我想为它添加一个盒子阴影，但正如你在jsfiddle中看到的，由于间隙，它看起来很可怕，我用红色边框突出了滑块，这样你就可以看到间隙，这是什么原因？可以修复吗？

#slider {
    width:40%;
    float:left;
    border: 2px solid red;
    box-shadow: 0px 0px 4px 4px #000;
}

jsfiddle：http://jsfiddle.net/SWVys/4/

Answer 1

图片默认为inline个元素。它们周围增加了空白区域，以便在它们与其他元素之间提供缓冲。

只需将其添加到您的CSS：

#slider img {
    display: block;
}

DEMO