javascript - ボックスを均等に配置しますが、それぞれの間にマージンがあります

Question

同様の質問からのフィドルは次のとおり です。右マージンがボックス間の最小間隔として扱われ、間隔がその量を下回ると、すべてが行の下に移動するようになるとよいでしょう。また、現在行の最後のボックスに右マージンがあってはなりません。

そして、いくつかの下マージン。固定量でもよいし、現在の水平間隔と等しい量でもよいでしょう。

$(new Array(9).join('<div class="invisible"></div>\n')).insertBefore('.stretch');

$(window).on('resize', function() {
$('#container').height($('.box').last().position().top +     $('.box').last().outerHeight());

//make it still justify when there's only one row
if ($('.box').first().position().top == $('.box').last().position().top) {
    $('.invisible').hide();
} else {
    $('.invisible').show();
}
}).resize();