あなたのためのパズルのビット....
幅730px、自動高さのdivがあります。この中に、164px X 261px の小さな div の数があります。
これらはテンプレートに動的に取り込まれるため、1 にすることも、18 にすることも、この演習のために 1000 にすることも、その中間にすることもできます。
各行でそれぞれの間隔が等しくなるように、これらの間隔を空ける必要があります。最大 4 つを扱う場合は簡単です。次のようなことができます。
var totalWidth = $('.bigDiv .smallerDivs').length * $('.bigDiv .smallerDivs').width();
var margin = ($('.bigDiv').width - totalWidth) / ($('.bigDiv .smallerDivs').length * 2);
$('.bigDiv .smallerDivs').css('margin-left': margin , 'margin-right': margin);
ただし、5つあるとします。上の行に3つ、下の行に2つ置きたいです。または、7 つある場合は、上に 4 つ、下に 3 つが必要です。11 個ある場合は、上に 4 個、中央に 4 個、下に 3 個など、小さなボックスの数に基づいて各行を適切に調整します。
誰かが私がこれについて行くかもしれない素敵なきれいな方法を提案できますか?