Problema centraggio box div

[Cippiri]

Ciao a tutti! Questo è il mio primo post! Premetto che non sono un cultore di HTML, anche se di solito me la riesco a sfangare abbastanza bene.
Ho però un problema che mi sta facendo rognare, sono alle prese con un template già preimpostato strutturato come segue:


Col seguente codice

<!-- page header -->
<section id="page-header" class="team">
    <div class="container clearfix">
        <hgroup>
            <h1 class="page-title">Artists</h1>
            <h2 class="page-subtitle">Meet our artists.</h2>
        </hgroup>
        <!-- share it -->
        <div id="share-wrap">
            <div id="share" data-url="artists2.html" data-text="Artists" data-title="share"></div>
        </div>
        <!-- /share it -->
        <hr>
        <!-- masonry boxes -->
        <div class="masonry-wrap clearfix">
            <div class="masonry width-1-4 height-1-2">
                <a href="artist.html" class="thumb-icon tip" data-tip-title="DJ Envato" data-tip-desc="Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc consectetur eros eget lacus fringilla in feugiat odio viverra.">
                    <img src="placeholders/01-artist-image-233x468.jpg" alt="" title="This is an example of a caption" />
                    <span class="icon plus"></span>
                </a>
            </div>
            <div class="masonry width-1-4 height-1-2">
                <a href="artist2.html" class="thumb-icon tip" data-tip-title="DJ Themeforest" data-tip-desc="Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc consectetur eros eget lacus fringilla in feugiat odio viverra.">
                    <img src="placeholders/02-artist-image-233x468.jpg" alt="" title="This is an example of a caption" />
                    <span class="icon plus"></span>
                </a>
            </div>
            <div class="masonry width-1-4 height-1-2">
                <a href="artist.html" class="thumb-icon tip" data-tip-title="DJ Graphicriver" data-tip-desc="Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc consectetur eros eget lacus fringilla in feugiat odio viverra.">
                    <img src="placeholders/03-artist-image-233x468.jpg" alt="" title="This is an example of a caption" />
                    <span class="icon plus"></span>
                </a>
            </div>
            <div class="masonry width-1-4 height-1-2">
                <a href="artist2.html" class="thumb-icon tip" data-tip-title="DJ Videohive" data-tip-desc="Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc consectetur eros eget lacus fringilla in feugiat odio viverra.">
                    <img src="placeholders/04-artist-image-233x468.jpg" alt="" title="This is an example of a caption" />
                    <span class="icon plus"></span>
                </a>
            </div>
        </div>
        <!-- /masonry boxes -->
    </div>
</section>
<!-- /page header -->

Ora, come si può notare, ci sono 4 box arancioni selezionabili, a me ne servono 5. Ho provato ovviamente ad aggiungerne semplicemente uno, ma me lo mette a capo, sotto gli altri. Smanettando un pò sono riuscito a ottenerne 5 in linea ma stavolta il problema era che erano tutti spostati a sinistra e quindi non centrati.
Qualcuno sa indirizzarmi verso la retta via per ottenere 5 caselle in linea e centrate?
Grazie in ogni caso
(PS il comando <center> ovviamente non è stato di aiuto)

 

[filomeni]

Ciao,
metti tutte le immagini in un div <div style="position:relative;height:XXX;width:xxx;top: (in pixel quanto ti serve);left:50%;z-index:3000;"><img src="le tue img"></div>
height: l'altezza dell'immagine in pixel.
width:la larghezza complessiva delle 5 immagini.
Ovvio che devi considerare se il template è in css devi modificare lo stesso...
Ciao

 

[felino]

Se metti online la pagina HTML è più semplice poterti aiutare.