centrare verticalmente img in un div

[robyd]

Ciao a tutti,
ho creato un box che è strutturato come segue:

-------header--------
col sx--corpo--col dx
--------piede--------

con il seguente codice:

<div class="box">
  <div class="header_box"></div>
  <div>
    <div class="col_sx"><img></div>
    <div class="centro"></div>
    <div class="col_dx"><img></div>
  </div>
  <div class="piede_box"></div>
</div>

e il codice css:

.box{
	width: 300px;
	height:auto;
	line-height:100%;
	margin-bottom: 18px; /* margine inferiore di ogni box*/	
}
div.header_box{height:23px;color:#FFF;line-height:23pxborder-bottom: 1px solid #CCC}
div.col_sx{width:20px;float:left; height:auto;line-height:100%;}
div.centro{float:left; height:auto;line-height:100%;}
div.col_dx{width:20px;float:right; height:auto;line-height:100%}
div.piede_box{background-color:#EEEEEE; height:22px;border-top: 1px solid #CCC}

le img presenti nelle colonne sono due freccie di scorrimento e vorrei che si centrassero verticalmente al crescere del contenuto della colonna "centro".
Esiste un modo per far questo o devo utilizzare una struttura tabellare?

Grazie mille

[ricman]

Prova a iniziare a definire un'altezza... Cioè assegna anche height:100% al tag Html