como lograr que las imagenes se vean una al lado de otra dentro de un div

[intiweb]

hola mi problema es el siguiente.
tengo un clase css que se llaba box y lo que hace es mostrar un sierto pedazo del contenido de un div y agregarle automaticamente un scroll bar para ver todo el contenido que hay en el div.
la clase es la siguiente

Código CSS:

.box {
    border-width:5px;
    border-color:#CCC;
    border-bottom-style:outset;
    border-left-style:outset;
    border-right-style:outset;
    border-top-style:outset;
    width: 703px;
    height: 495px;
    overflow:auto;
}
 

bueno dentro del div al que le asigne esta clase recupero fotos de la base de datos y las muestro.
yo pongo el codigo del div de esta menera:

Código HTML:

<div id="box" class="box">
 
<img height='477' src='fotos/".$album."/".$nombre."'></a>
<img height='477' src='fotos/".$album."/".$nombre."'></a>
<img height='477' src='fotos/".$album."/".$nombre."'></a>
 
</div>
 

el tema es que las fotos normalmente se deverian ver una al lado de otra y el scrollbar ser orizontal, pero no se porque me aparecen una foto abajo de otra y el scrollbar vertical.

alguien sabe como lograr en el estilo css que se vean horizontales las fotos y no una arriva de otra ??

desde ya muchas gacias y espero que alguien sepa como hacerlo XD !!