css - Elements can't float below the previous row's too tall first element -


i have list of floated elements width of 33%, 3 elements per line. height vary. also, using javascript sorting plugin , cannot use css property.

problem: if first element of given row taller other ones, first element of next row cannot float below it. how fix that?

enter image description here

css:

.resource_item {     float: left;     width: 31%;      margin-bottom: 30px;         padding-left: 1%;     padding-right: 1%; } 

php:

while ...      ?>     <div class='resource_item'>         content     </div>     <?php  endwhile; 

as comment pointed out (the person removed reason) problem solved setting elements display: inline-block instead of floating them.


Comments

Popular posts from this blog

php - Invalid Cofiguration - yii\base\InvalidConfigException - Yii2 -

How to show in django cms breadcrumbs full path? -

ruby on rails - npm error: tunneling socket could not be established, cause=connect ETIMEDOUT -