CSS Clearing无法按预期工作

Question

所以在我的profile.php上我有一个加载的标签，显示用户在他们的个人资料上发布的最近10条消息。 我正在尝试在div中显示每个区域，然后浮动已在页面上发布的用户浮动到div左侧的图像。但是当我这样做时，整个div都以一种奇怪的方式崩溃。如下所示：

所以在我遇到一些问题后，我试图添加一个明确的：两者;图像代码中的代码行，这就是它给我的内容：

简单地说我希望div都是相同的高度而顶部的div没有那么高的高度，而且让我感到困惑的是为什么它实际上就是那个高度。

以下是在消息div中运行的代码：

while ($r = $query->fetch(PDO::FETCH_ASSOC) ) {
          ?>
            <div style="background-color: white; color:black; margin-left:280px; padding:5px; font-family: Sintony; font-size:16px; margin-bottom:5px;">
                <img src="<?=user::idToPic($r['userID'])?>" width="50" height="50" style="float:left;" />
                Test Message

                <div style="clear:both;"> </div>
            </div>

          <?php
        }

这是第一条消息的浏览器输出，然后是第二条消息

Answer 1

将height: 50px;放在每个div上，或者只使用类。

Here you go

Answer 2

将其更改为     最小高度：50px