Jquery 网站上用于显示产品的css问题

我在下面的网站上工作，因为网站主页运行良好，唯一的问题是：图片中的图片应该显示连续4个，但是css没有这样做，如果我强迫它浮动：左，悬停效果只对前四个产品有效，而不是对所有产品

这里是网站链接

这是我正在谈论的页面的哪一部分的截图

这是织布机视频，我添加了浮动，但悬停效果仅在第一行工作，而不是在第二行和之后

https://www.useloom.com/share/55327cbb265743f39c2c442c029277e0

使用以下命令：

.masonry.four-col .project-post {
    width: 24.98%;
    float: left;
}

---

下面的解决方案对你很有帮助

更改

项目发布

类的css

使用这个css

.masonry.four-col .project-post {
    width: 24.84%;
    display: inline-block;
}

---

希望此解决方案对您有所帮助。

将宽度

24.98%

更改为

23.98%

，并将

显示：内联块

放入

中。project post

类您可以使用

24.84%

来精确匹配屏幕中的图像，在

23.98%

中，第四幅图像后应该有一些空白。