ancora... Immagine centrata in div...

[sifting]

Salve a tutti... Ringrazio già molto chi mi darà una mano... magari per voi è una cavolata... Ho letto centinaia di articoli sull'argomento e non ne vengo fuori... o non capisco dove sbaglio... In pratica con i div devo costruire una tabella 480x212 px , (quindi fissa) con quattro "celle" sopra e 4 sotto. Tutte dovrebbero avere sia in alto, che a destra, sinistra che sotto bordo 4 px. Dentro ogni cella dovrei mettere un'immagine fissa 76x76 ( non in background perchè diventerà un link). Il problema è che io l'immagine la vorrei al centro di ogni cella!! In orizzontale nessun problema ma non ne vengo fuori per posizionarle tutte in verticale... Ho provato varie soluzioni ma niente...
Posto il codice interessato... Grazie!!!

Parte HTML:

<div id="content">
<div class="main">
<div class="rowsup"></div>

<div class="cell" ><a href=""><img src="images/padlock.png"></a></div>
<div class="cell" ><a href=""><img src="images/luceon.png"></a></div>
<div class="cell"><a href=""><img src="images/ipcam.png"></a></div>
<div class="cell"><a href=""><img src="images/setting.png" ></a></div>

<div class="rowcenter"></div>

<div class="cell"><a href=""><img src="images/sound.png" ></a></div>
<div class="cell"><a href=""><img src="images/sound2.png" ></div>
<div class="cell"><a href=""><img src="images/sound3.png" ></div>
<div class="cell"><a href=""><img src="images/soun4.png" ></div>

<div class="rowinf"></div>
</div>
</div>
_____________________

Parte CSS:

html{
width:100%;
height:100%;
background-color:#CCC;
}


body{
width:100%;
height:100%;
}
#container
{
width: 480px;
margin:auto;
background-color:#CCC;
}

.... ( salto la parte del header)

#content {
width: 480px;
height: 212px;
background-color: #39F;}


div.main {
width: 480px;
margin: auto;}

div.rowsup {
clear:both;
border: 3px solid #FFF;
}
div.rowcenter {
clear:both;
border: 1px solid #FFF;
}
div.rowinf {
clear:both;
border: 3px solid #FFF;
}

div.cell {
float: left;
width: 112px;
height: 92px;
border: 4px solid;
color: #FFF;
display: table-cell;
text-align: center;
vertical-align: middle;}


Grazie ancora...

[widoz83]

visto che è un layout fisso, una modifica al volo potrebbe essere questa:

div.cell {
   float: left;
   width: 112px;
   height: 76px;
   padding: 8px 0;
   border: 4px solid;
   color: #FFF;
   display: table-cell;
   text-align: center;
}

[sifting]

Grazie!! funzia...!! Ora ho capito dove sbagliavo... Grazie mille!!!!