Css 停止图像堆叠

我故意让我的图像在垂直方向上相互重叠，但现在图像已经堆叠在彼此的顶部。我该如何阻止这种情况发生？这是

我尝试在图像中添加z索引，这在以前的布局中起作用，但没有起作用-

.home_post_box {
    float: left;
    width: auto;
    height: auto;
    margin-right: 356px;
    margin-bottom: 30px;
    position: relative;
    cursor: pointer;
    display: inline-block;
}
.home_post_box img {
    width: 371px;
    height: auto;
    padding-bottom: 20px;
    transform: -webkit-transform: rotate(-1deg);
    -moz-transform: rotate(-1deg);
    -webkit-transform: rotate(-1deg);
    -webkit-backface-visibility: hidden;
    outline: 1px solid transparent;
    text-align: center;
    position:absolute;
    left:0px;
    top:0px;
    z-index:1;
    padding-left: 0px;
}

---

据我所见，您应该尝试将每一行图片封装在自己的

中，并将

桌面清除
或
平板电脑清除
元素放在这些行之间

你也可以用它来清理，它有点干净，但我不知道你想做什么。也许它会有用。
也许这与您的尝试很接近

.home_post_box {
float: left;
width: auto;
height: auto;
position: relative;
cursor: pointer;
display: inline-block;
}

.home_post_box img {
height: auto;
padding-bottom: 20px;
transform: -webkit-transform: rotate(-1deg);
-moz-transform: rotate(-1deg);
-webkit-transform: rotate(-1deg);
-webkit-backface-visibility: hidden;
outline: 1px solid transparent;
text-align: center;
left: 0px;
top: 0px;
z-index: 1;
padding-left: 0px;
float: left;
}

你到底想做什么？请，请不要这样格式化你的CSS。每行使用一条规则要容易得多（这也将帮助你解决问题）。格言，正如我在标题和正文中所说的，我正试图阻止图像堆叠Josiah，现在编辑了我的css。我同意，更容易。。所以我只加了float：左？