CSS: album fotografico

[Muzztein]

Holas.

Suponiendo que se tiene el siguiente codigo HTML

Código PHP:

  <div class="foto"><img src="images.jpg"/></div> 
<div class="foto"><img src="images.jpg"/></div> 
<div class="foto"><img src="images.jpg"/></div> 
<div class="foto"><img src="images.jpg"/></div> 
<div class="foto"><img src="images.jpg"/></div> 
<div class="foto"><img src="images.jpg"/></div> 
<div class="foto"><img src="images.jpg"/></div>  
   

¿Como es posible, solo usando CSS, mostrar en pantalla las fotos de manera concatenada y no listada hacia abajo?

Mi idea es que las fotos aparezcan asi:




y no asi.






Me explico?

Cualquier ayuda para enviarme en la direccion correcta seria bienvenido.
de antemano gracias.

[Calizman]

Saludos Muzztein

Intenta ponerle al div esta propiedad:

display: inline;

y te recomiendo que esos divs los metas dentro de un gran div por ej:

<div id="album">
<div id="foto"></div>
<div id="foto"></div>
<div id="foto"></div>
</div>

el div album ponle
display: block

y a los divs foto ponles
display: inline

Intentalo y me cuentas!

[Mikmoro]

Deberías poner a la clase foto un float: left

.foto {float: left;}

Para que te entren 5, ni una más ni una menos, lo que deberías hacer es encerrar tdo ese grupo dentro de otra caja a la que des un ancho adecuado como para que quepan 5 cajas.

[Aresillo]

Si veis que tal chocais! ni un minuto mas ni menos...

Aresillo!!
Qué CaliZzZ atareao con el duelo??

[Mikmoro]

En el mismísimo minuto.

Una deja unos espacios entre las imágenes y la otra no. ¿Cuál es cuál?

[Muzztein]

Muchas gracias! eso fue rapidisimo

Probe con los dos metodos propuestos:

el primero Block /inline , me parecio mas elegante, sin embargo cuando le aplico un padding al div de clase foto para que se vea mas ordenado, por alguna razon se solapan el uno con el otro.(en IE y FF)

El segundo metodo con el float:left, que es mas sencillo, resulto a prueba de balas.

Lo mejor es que aprendi muchismo.
Gracias a los dos... repartire karma para todos

[Mikmoro]

Por esa razón no soy muy aficionado al display inline. Para algunas cosas viene bien, pero para otras produce "efectos secundarios"

Me alegro de que te sirvan las dos respuestas para probar y aprender

[Calizman]

:O lo tendre en cuenta para el duelo xD