块高度是一个问题 - 我试过各种方式，但:(

Question

发帖高度有问题。帮帮我们..

请查看网站：http://www.mulberrydesignerkitchens.com/

<li>
<div class="thumb-img">
<a title="Hiring a Professional Designer for Your Kitchen" href="http://www.mulberrydesignerkitchens.com/hiring-a-professional-designer-for-your-kitchen/">
<img class="attachment-home-thumbnail wp-post-image" width="163" height="110" title="Oak kitchen Cupboard" alt="Oak kitchen Cupboard" src="http://www.mulberrydesignerkitchens.com/wp-content/uploads/Oakkitchen31-163x110.png">
</a>
</div>
<div class="post-text">
<h3>
<a href="http://www.mulberrydesignerkitchens.com/hiring-a-professional-designer-for-your-kitchen/">Hiring a Professional Designer for Your Kitchen</a>
</h3>
<p>
Ensuring that you hire the correct professional is far more important than vision, design or budget when it comes to having your kitchen built properly and safely.
<a class="more-link" href="http://www.mulberrydesignerkitchens.com/hiring-a-professional-designer-for-your-kitchen/#more-580">
<span class="more">[more]</span>
</a>
</p>
<div class="wpfblike" style="height: 40px; display: none;">
<fb:like class=" fb_edge_widget_with_comment fb_iframe_widget" send="false" colorscheme="light" action="like" width="400" show_faces="true" layout="default" href="http://www.mulberrydesignerkitchens.com/hiring-a-professional-designer-for-your-kitchen/">
</div>
</div>
</li>

Answer 1

（1）在每个</li>之前，添加div进行清算。这是最重要的一步：

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

（2）将border-bottom样式从文字div移至li

（3）您还可以向margin-bottom添加一些li并减少margin-bottom的{​​{1}}

Answer 2

在border-bottom而不是li中定义.post-text。写得像这样：

#homepage-images ul li {
    border-bottom: 1px solid #CCCCCC;
    margin-top: 20px;
    width: 560px;
    overflow:hidden;
}
.post-text {
    padding-bottom: 10px;
}

Answer 3

设置li标签的边距和边框，而不是div标签。