html - 图像 slider 有不需要的间隙

Question

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

#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