Css问题-李正在获得未知的保证金？

Question

我正在编写一个HTML CSS模板，我陷入了列表项(li)从某个地方获得底限的情况，下面是我的代码：

JSFIDDLE

<div id="main-4">
    <ul>
        <li>
            <img src="http://demo.htmlcoder.me/ivega/images/portfolio-1.jpg" alt="#">
        </li>
        <li>
            <img src="http://demo.htmlcoder.me/ivega/images/portfolio-2.jpg" alt="#">
        </li>
        <li>
            <img src="http://demo.htmlcoder.me/ivega/images/portfolio-3.jpg" alt="#">
        </li>
        <li>
            <img src="http://demo.htmlcoder.me/ivega/images/portfolio-4.jpg" alt="#">
        </li>
    </ul>
</div>

CSS

#main-4 ul li {
    list-style-type: none;
    float: left;
    width: 337px;
}

    #main-4 ul li > img {
        width: 337px;
    }

Answer 1

这是因为图像可以做到这一点。给你的图片vertical-align:bottom，看看它是如何修复的：

#main-4 ul li {
    list-style-type: none;
    float: left;
    width: 337px;
}

    #main-4 ul li > img {
        width: 337px;
        vertical-align:bottom;
    }