Html 我怎样才能清除第三个div，就像上面的两个div一样？

这就是我想要解决的问题

<div class="post">

    <div class="date">
        <div class="day">01</div>
        <div class="month">Jan</div>
    </div>

    <div class="post-info">
    <h2><a href="#">Donec commodo et justo ac bibendum. Lorem ipsum dolor sit ametit</a></h2>
    </div>

</div>

<div class="post">

    <div class="date">
        <div class="day">01</div>
        <div class="month">Jan</div>
    </div>

    <div class="post-info">
    <h2><a href="#">Donec commodo et justo ac bibendum. Lorem ipsum dolor sit amet, consectetur adipiscing elit.</a></h2>
    </div>

</div>

        <div class="post">

            <div class="date">
                <div class="day">01</div>
                <div class="month">Jan</div>
            </div>

            <div class="post-info">
            <h2><a href="#">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin facilisis mi tellus, at venenatis justo fermentum at. Ut sed nulla leo. Quisque pulvinar massa ut velit porttitor imperdiet. Ut sit amet sollicitudin lacus, at tincidunt mauris. Donec commodo et justo ac bibendum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin facilisis mi tellus, at venenatis justo fermentum at. Ut sed nulla leo. Quisque pulvinar massa ut velit porttitor imperdiet. Ut sit amet sollicitudin lacus, at tincidunt mauris. Donec commodo et justo ac bibendum. </a></h2>
            </div>

        </div>

01
简
01
简
01
简

我希望第三组的内容像这样被清除

---

我不想为元素应用高度。有没有其他方法可以实现这一点？

您可以为div显示表格单元格：

.date, .post-info {
    display:table-cell;
}

试试这个CSS：

.post{
    margin:0px 0px 25px 0px;
    padding:0px 0px 15px 0px;
    display: table;
}

.post .date{
    font-size:18px;
    margin:0px 25px 0px 25px;
    line-height:22px;
    text-align:center;
    display: table-cell;
    padding-right: 10px;
}

.post-info{
    width:780px;
    display: table-cell;
}

.post{
    margin:0px 0px 25px 0px;
    padding:0px 0px 15px 0px;
    width: 780;
}

.post-info{
    width: calc(100% - 100px);
    float: left;
}

---

您可以从中修改

.post h2

类

.post h2 {
    font-size:20px;
    line-height:24px;
}

到

---

我建议用百分比代替。您可以设置容器

post

的宽度，然后将

post info

的宽度设置为最大宽度减去日期div的宽度

.post{
    margin:0px 0px 25px 0px;
    padding:0px 0px 15px 0px;
    width: 780;
}

.post-info{
    width: calc(100% - 100px);
    float: left;
}

---

只需在右侧div中添加样式“display:inline block”。

像这样

---

哪个第三组？你这里大概有30个div？你所说的清除是什么意思？我指的是class=“post”}的最后一个div，请看屏幕截图和jsfiddle代码段。好的，你基本上是在告诉浏览器这些元素应该像表格一样显示。因此，.post是包含表，.date和.post信息是该表中的单元格。这将把元素显示为一个表，但您仍然有一个有效的搜索引擎标记：）您只会看到表的显示，而不会看到它的标记。嗯……谢谢taxicala！没问题，很高兴我能帮助你！

.post-info{
width:780px;
    display:inline-block;
}