Redimensionar varias imagenes en un div

[Cota_Isla]

Buenas,
estoy realizando una página web y en apartado galería de imágenes pongo 4 imágenes en un div. El problema me surge que como he realizado las imágenes se me redimensionan correctamente pero claro al asignarles un ancho especifico la altura puede ser menor de la asignada en el div, por lo que me gustaría centrarla verticalmente en el div. Comentar que dentro del div contenedor hay cuatro divs uno para cada imagen.
Adjunto el código a ver si alguien me puede ayudar.

Código HTML:

<div id="fila">
       <ul>
              <li>
                    <div>
                             <a href="../multimedia/imagenes/1.jpg" target="_blank"><img  src="../multimedia/imagenes/1.jpg"></a>
                    </div>
              </li>
              <li>
                     <div>
                             <a href="../multimedia/imagenes/2.jpg" target="_blank"><img src="../multimedia/imagenes/2.jpg"></a>
                     </div>
              </li>
              <li>
                      <div>
                               <a href="../multimedia/imagenes/3.jpg" target="_blank"><img src="../multimedia/imagenes/3.jpg"></a>
                       </div>
               </li>
                <li>
                       <div>
                                 <a href="../multimedia/imagenes/4.jpg" target="_blank"><img src="../multimedia/imagenes/4.jpg"></a>
                       </div>
                </li>
         </ul>
</div> 

Código:

#fila{
    width: 99%;
    height: 40%;
    margin-right: 0%;
    margin-left: 0%;
    margin-bottom: 1%;
    margin-top: 0%;
}
#fila div{
    float: left;
    text-align: center;
    width: 25%;
    height: 100%;
    margin: auto;
}
#fila img{
    width: 100%;
    height: auto;
}