Question

我有一个网站 - 你可以在这里看到我有一个截图在这里我想停止我的readmore文字环绕图像时，它的小图像和大量的文字

<div class="page-list-ext-item">

<div class="page-list-ext-image"><img width="110" height="73" class="attachment-110x110 wp-post-image" src="#"></a></div>


<h3 class="page-list-ext-title">Heading</h3><div class="page-list-ext-item-content">TEXT

<br><br>read more on: <a href="#">Title</a>

</div>

Answer 1

您需要做的第一件事就是重写标记，以便它可以验证。以上标记不会验证。浏览器总是尝试修复无效的标记，但从纯CSS的角度来看，这种关闭标记通常是导致多个错误的主要原因。在您的情况下，浮动总是需要一个有间隙的容器，例如：

.clear:after {
    content: '.';
    display: block;
    overflow: hidden;
    clear: both;
    height: 0;
    visibility: hidden;
}

这将清除缩略图的容器，但您仍需要修复标记。

Answer 2

您可能想要添加

.page-list-ext-item-content{
    overflow:hidden;
}

这样可行。

如何停止浮动Divs包装（缩略图）

2 个答案: