css - CSSのギャップなしでdivを並べて配置する

Question

ループから生成された div を並べて配置し、

しかし、1番目と4番目のdivの間にギャップがあります。どうすればそのギャップを取り除くことができますか? 助けてください..

私のdivの画像はこちら

cssを次のように追加しました

.div_class {
    bottom: 0;
    display: table-cell;
    left: 0;
    position: relative;
    vertical-align: top;
    float: left;
    height: auto !important;
    overflow: hidden;
    width: 300px;
}

編集： ここにフィドルがあります

Answer 1

このjQueryプラグインを見てください：

石積み
同位体

これらのプラグインはこれに加えてこれを行います。