使用float来对齐div元素

Question

我正在尝试将包含一些图像的div标记对齐一个小图库。我使用float:right似乎工作但由于某种原因在某一行而不是有一个div，空间只是空的，而div在下一行跳转到它。你可以在这里看到它：example

<div class='gridImage' >
    <div class='titel'>".$row['titel']."</div><br/>
    <img class='ritratti' data-size='". $row['size']. "' data-itemnr='". $row['itemNr']. "'  src='uploads/".$row['img']."'/><br/>
    <div>".$row['size']."</div><br/>
</div>";


.gridImage{

width:40%;
float:right;
padding:10px;
display:inline;
text-align:center;
}

Answer 1

试试这个吗？

.gridImage {
    width: 40%;
    display: inline-block;
    text-align: center;
}