Problema centratura box div

[ZeroShift]

Ok. Però, se l'elemento contenitore principale ha una dimensione fissa (immagino sia così), puoi capire da te che non puoi far altro che ridurre la larghezza dei box/immagini per farci stare un ulteriore box. Che sia poi agendo direttamente sul file immagine o da proprietà html o dal css, il discorso non cambia.

Potresti provare ad agire da css. In base alle regole applicate sui box (mi riferisco a <div class="masonry width-1-4 height-1-2">
), potresti provare ad apportare queste modifiche:

    .masonry.width-1-4 { width: 186px; } /* anziché 233px */
    .masonry.height-1-4 { height: 233px; }
    .masonry.width-1-2 { width: 468px; }
    .masonry.height-1-2 { height: 374px; } /* anziché 468px */
    .masonry.width-3-4 { width: 703px; }
    .masonry.height-3-4 { height: 703px; }

Chiaramente, se altri elementi sulla pagina utilizzano tali regole, queste saranno applicate indistintamente. Per cui fai tu le dovute considerazioni.

Inoltre mi pare di capire che tu stia lavorando su un template responsive. In tal caso dovresti assicurarti se, effettuando eventuali modifiche a quei singoli elementi, non si vada a sfasciare in qualche modo la struttura nelle altre risoluzioni, e quindi compromettere il funzionamento del responsive.

Mi sa che dovrò ridurre le immagini, ho provato col tuo sistema e sembra funzionare, almeno nel primo nanosecondo in cui la pagina si carica vedo tutti i box allineati e più piccoli, però poi dopo un attimo il quinto box torna sotto e soprattutto a grandezza normale.
Sto diventando matto, ho pronto tutto il sito e mi manca solo sta cavolata!