Javascript 绝对图像未清除的浮动div

在中，您可以看到我正在处理的页面。当您更改窗口大小时，您将看到它是响应的

但是，浮动的三个旋转图像框（高度自动，下方有一个清除div）未清除

其目的是使div包含这些旋转图像，并在其顶部和底部填充20px

我的css当前：

.rightbox{width:100%; clear:both; float:none; height:auto; min-height:inherit;}

#rotating-item-wrapper, #rotating-item-wrapper2, #rotating-item-wrapper3 {margin: 10px 20px 0px; float: left; left:0; transform:none; height:auto;}

小于576px：

#rotating-item-wrapper, #rotating-item-wrapper2, #rotating-item-wrapper3 {margin: 5px 10px 0px; float: left; left:0; transform:none; width:26%;}

.rotating-item, .rotating-item2, .rotating-item3{width:100%; height:auto;}

---

我相信这将引导您走向正确的方向：

您可以将

高度设置为
.advertpanel
。浮动元素的当前高度为0，所以在这种情况下“清除”不起作用（在0之后清除）——这是因为旋转木马中的图像绝对定位

对于移动电话，问题不在于你
清除：两者都是
，而是清除浮动，但问题在于浮动元件的高度

你的旋转图像是绝对的，而容器，即使它是相对的和浮动的，也得不到里面图像的高度。尝试给出一个高度值（幻灯片图像的高度），而不是容器的
height:auto
。
用JavaScript修复

<script>
    var rotating = function(){
    var getheight = $('.rotating-item'); /* cache the selector */
    $('.advertpanel').css({ height: getheight.height() });
    }

    $(document).ready(rotating);
    $(window).resize(rotating);
</script>


var=函数（）{
var getheight=$（'.rotating item'）；/*缓存选择器*/
$（'.advertpanel'）.css（{height:getheight.height（）}）；
}
$（文件）。准备就绪（旋转）；
$（窗口）。调整大小（旋转）；
不建议通过链接实时站点来重现问题。而是创建一个JSFIDLE。@我不知道如何复制它。使用firebug按您的意愿对其进行编辑。如果无法做到这一点，则图像的高度会发生变化，而div需要随之变化。div也需要成为他们永久的广告空间，因为它是优质的广告空间。同样，容器宽度会改变，图像也会改变。这意味着高度必须是自动的，否则仍然会有我不想要的黑色空间。这取决于你如何解决它，但它不是关于清除浮动的问题，而是关于高度中的绝对元素：自动元素。如果你坚持你的身高：自动为里面的绝对元素，它是无用的。只是说用javascript修复了它。如果不先调整浏览器的大小，它将无法工作。有什么我做错了吗？是的，伙计，你的态度：）@bondythegreat很生气我的答案是高度自动下降中绝对项目的正确答案。。。