php - float 间隙怪异

我在这个问题上完全被阻拦，正在使用CMS，正在生成文章，并且希望它们在两个列中，因此

这是html代码（我删除了一些php部分，以免混淆您）：

  <div id="contenu_col">


    <?php

            echo '<div class="col1">
<a href="exhibition.php?ID='.$ID.'"><img src="square/'.$IMGACSQ.'" ></a><br/>
            <p><a href="exhibition.php?ID='.$ID.'">'.aff($DATE).'<br/>'.aff($nom_projet).' - '.aff($ARTISTE).'</p></a></div>';

</div>

生成如下所示的html代码：

    <div class="col1">
<a href="exhibition.php?ID=109">
<img src="square/E_3094_x.jpg" >
</a><br/>

<p><a href="exhibition.php?ID=109">11.12. - 29.01.11.<br/>New impressions - New works -  new artists - new space 5 and a happy new year)</p></a>

</div>

<div class="col1">
<a href="exhibition.php?ID=108">
<img src="square/BG_IoanGrosu06_x.jpg" >
</a><br/>
<p><a href="exhibition.php?ID=108">30.10. - 04.12.10.<br/>Come here tomorrow - Ioan Grosu</p></a></div>

和CSS：

    .col1{
width:300px;
float:left;
padding: 3%;
display: block;

}


.col1 img{
width:100%;

}

.col1:after{
clear: both;
}

#contenu_col {
width:850px;
top:150px;
z-index:50;
left:460px;
position:absolute;
padding-bottom: 20px;
}

#contenu_col img{
width:100%;

}

（因为我无法发布图片...）

它可以使用网站的70％；有时会出现一些怪异的间隙。
我不明白我在做什么错:(

解决。谢谢！！

最佳答案

编辑您的col1类并添加高度，例如height:300px;

    .col1 {
    width: 300px;
    float: left;
    padding: 3%;
    display: block;
    height: 300px;
}

另外，您的DIV#encar样式也不佳。

关于php - float 间隙怪异，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18430491/