CSS：格式化块。奇怪的高度行为或如何通过块内的内容来调整高度

我对CSS并不十分熟悉，并遇到以下问题：CSS：格式化块。奇怪的高度行为或如何通过块内的内容来调整高度

我正在制作3个项目的列表（实际上它们是div），并添加了图片标题和中的每一个里面的一些描述。一切都很好，直到那时我被要求在此之后添加另一个块... 并且在我尝试了之后，我调查了添加的块几乎完全覆盖了新闻列表:(

这里是代码产生一个新闻列表+风格

// in loop for 3 items 
<div class="newslist"> 
    <a href="{{ item.get_absolute_url }}"> 
    <img src="{% thumbnail item.main_image 230x220 crop %}" alt="{{ item.image_description}}"/> 
    </a> 
    <br /> 
    <a href="{{ item.get_absolute_url }}" class="article_title">{{ item.title }}</a> 
    <p>{{ item.short_description|truncatewords:35}}</p> 
</div>

风格：

.newslist{ 
    display:block; 
    height:auto; 
    width: 22%; 
    float:left; 
    padding: 10px; 
    text-align: left; 

} 

.newslist a{ 
    margin-top:30px; 
    font-size:12px; 
    color: #be1e2d; 
    text-decoration:none; 

} 
.newslist a:hover{ 
    text-decoration:underline; 
} 

.newslist br{ 
    padding: 10px; 

} 

.newslist img{ 
    width:150px; 
    height:140px; 
    text-align: 
    padding: 5px; 
    margin-bottom:20px; 
    border: 1px solid #CCCCCC; 
    background:#f1efef;` 
} 

.newslist p{ 
    font-size:11px; 
} 

.newslist a:hover img{ 
    border: 1px solid blue; 

}

网页的完整源代码是在这里： http://j-in.org.ua

这里的问题是，如果下面的截图： http://img.skitch.com/20091021-d9y2i9h5cpxgk69fji2ue5pcib.png

和新的块的代码如下：在风格