Separar imagenes

[ThunderFx]

Hola, tengo un problema, lo que quiero hacer es separar imagenes, antes lo hacia con tablas pero estoy tratando de usar css solamente que no eneucnetro la solución mas que poniendoles una imagen de separador pero queria ver si se puede con CSS.

Tengo las imagenes asi

[img][img][img][img][img]

Entonces lo que quiero es que queden asi
[img] [img] [img] [img] [img]

Esas imagenes estan dentro de un div.
Saludos

[pablinff]

lo puedes hacer asignandole atributos como por ejemplo left.
Te quedaría así:

Código:

<img style="left:20px">
<img style="left:30px">
<img style="left:40px">
<img style="left:50px">

De esa forma te quedaría la 1º imagen a 20px del borde izquierdo y las demás separadas 10px cada una de la otra.
Se puede hacer de otras formas, pero si te funciona esto creo que es la más fácil.
Saludos y espero que te sirva.

[ThunderFx]

Hola muchas gracias por la respuesta aunque la verdad no me funciono :(

Otro problema que resulto .. En ese div tengo puesto un img de fondo que mide de alta 26px .. Asi que puse en el css "height:26px", el problema es que al agregarle las imagenes me hace un poquito mas alto el tamaño, le puse de padding 0 pero no resulto.

Gracias

[juanchilo]

mira segun como esten estructuradas tus imagenes y como desees mostrarla pero puedes hacer asi...

teniendo el caso que las dos estan en un mismo <div>:

Código HTML:

<div class="fotos">
<img1 />
<img2 />
</div> 

en el Css pones asi:

Código:

.fotos img { margin-left:30px; }

eso creará una diferencia de 30px a la izquierda de cada imagen separandola a ambas de si mismas. Pueden ser muy diferente lo que busques pero la idea es esa, utilizar elementos margin y padding para lograrlo.

saludos

[juanchilo]

Iniciado por pablinff

lo puedes hacer asignandole atributos como por ejemplo left.
Te quedaría así:

Código:

<img style="left:20px">
<img style="left:30px">
<img style="left:40px">
<img style="left:50px">

De esa forma te quedaría la 1º imagen a 20px del borde izquierdo y las demás separadas 10px cada una de la otra.
Se puede hacer de otras formas, pero si te funciona esto creo que es la más fácil.
Saludos y espero que te sirva.

la verdad que el atributo left; es utilizado para ejemplo... position: absolute;

lo que si puedes hacer para ese caso es utilizar left; y top; (por dar ejemplos) asignados a las imágenes acompañados del position: absolute;

bye

[ThunderFx]

Les agradezco por haberse tomado su tiempo.
Lo logré solucionar con el margin-left .. ahora solo me falta solucionar ese problema .. que solo el div agarra su tamaño pefecto que es de 26px .. pero al meterle las imagenes lo hace mas grande ..

Ahi es donde probe en ponerle padding 0 pero no me funcionó.

Gracias, mientras sigo buscando ..

[ThunderFx]

Logré solucionarlo .. Muchas gracias..

Post cerrado xd