css - 李拥抱浮动图像

Question

我上传了以下页面，以便您更轻松地帮助我： http ://www.rebuslondon.com/GEBROCHUREcopy.html 不要使用 Internet Explorer，因为我没有为此优化页面。

如您所见，有 4 张图像，即 3 张橙色和 1 张黄色。橙色的只是嵌入到父元素中，而黄色的则是浮动的，因此当浏览器窗口放大时它会粘在父元素的右边缘。这可以正常工作，但是当窗口变窄时（例如 1024*768），这会在浮动图像下方产生一个间隙。

有没有办法让这个差距消失？我想您了解问题的最佳方式是尝试调整浏览器窗口的大小。您会注意到窗口越窄，间隙就会变得越大。

非常感谢！

Answer 1

问题是您在 li.right 之后的 li 中添加了 clear:both。如果您删除此规则，它会显示正常。

#portfolio #container > ul.projFlow li.floated + li {
    clear: both;
}

Answer 2

只需从您的 contents.css 行 90 中删除 clear

#portfolio #container > ul.projFlow li.floated + li {
clear: both;
}

只需完全删除它就可以了。