父元素添加了不必要的空格

Question

我正在制作图像滑块，由于某种原因，父元素无缘无故告诉父div底部添加了空格。 如果有更好的方法来设置CSS，那么我真的很感谢一个指针。 这是代码：

HTML：

<div id="imgslider">
    <ul class="bxslider">
        <li>
            <img src="http://localhost:8888/wordpress/wp-content/uploads/2015/08/DevelopImages_PureTisanes_LowRes-11.jpg" alt="" />
        </li>
        <li>
            <img src="http://localhost:8888/wordpress/wp-content/uploads/2015/08/DevelopImages_PureTisanes_LowRes-1.jpg" alt="" />
        </li>
    </ul>
<div class="clear"></div>

CSS：

#imgslider {
    display: block;
    height: inherit;
}
.bxslider {
    position: relative;
}
.bxslider img {
    width: 100%;
    max-height: 750px;
    position: absolute;
}
.bxslider img:first-child {
    top: 0;
    left: 0;
    z-index: 1;
}

Answer 1

末尾有一个未关闭的div :-)也许这是导致问题的原因：

    <div id="imgslider">
        <ul class="bxslider">
            <li>
                <img src="http://localhost:8888/wordpress/wp-content/uploads/2015/08/DevelopImages_PureTisanes_LowRes-11.jpg" alt="" />
            </li>
            <li>
                <img src="http://localhost:8888/wordpress/wp-content/uploads/2015/08/DevelopImages_PureTisanes_LowRes-1.jpg" alt="" />
            </li>
        </ul>
</div>
    <div class="clear"></div>

Answer 2

不确定是否会有所帮助，但是我已经读过“ clear：both ”，在底部添加了一些空间，因此您可能想向父div添加“ overflow：hidden ”（我认为它是ID为“ imgslider ”的div）

#imgslider {
    display: block;
    height: inherit;
    overflow:hidden;
}