Espacios entre imágenes
Hola,
A ver si alguien me puede decir como puedo solucionar un pequeño problema que tengo. (y yo si me se explicar)
tengo un div en la pantalla, dentro de el tengo 3 imágenes, que quiero que vayan una debajo de la otra sin dejar espacio. ejemplo
<code><div>
IMG<br>
IMG<br>
IMG<br>
</div></code>
El problema esque con el este encabezado:
<DOCTYPE>
el explorer me los alinea sin espacio entre gráficos, pero el firefox me deja una linea de unos dos pixels, lo curiso esque si le quieto el doctype, el firefox no me deja los espacios. (esta claro que quiero seguir conservando el doctype, quitarlo no es la solución)
Alguien sabe como podria quitar esos espacios en firefox ?
Gracias! :)
skido
mambrú
ivan75(arroba)gmail . com
Gracias! ;)
Usuario desconocido
Tienes un mail con los archivos.
SImplemente con gifs transparentes y selectores secundarios como :hover puedes conseguir lo mismo sin javascritps ni rollos de esos.
Coméntame que te parece
Edito: no tienes ningún email , porque en tu ficha no pone cómo contactar contigo. Dímelo y te lo mando
skido
Hola! Antes de nada gracias por la ayuda ...
Pero no he sabido llevarlo a la practica o no funciona.
He subido un ejemplo de lo que quiero hacer.
http://www.hernaez.org/espacios/ (en firefox deja espacios y en IE no)
la ruta a los stylos es:
http://www.hernaez.org/espacios/main.css
A ver si alguien me ayuda y me permite de una vez, hacer una web sin una sola tabla ... no se ... me hace ilusión :)
Usuario desconocido
Antes de nada deberías mirar si entre las 3 imágenes tienes 184 px, que es el tamaño que le estás dando a fuego al div. Yo que tu le quitaba la altura, que ya la cogerá según le metas las imágenes. Con eso, y metiéndole padding y margin = 0 al *, te valdrá.
Si esas imágnes van a ser links, te recomiendo que también le metas outline:none para que FF no te deje un bordecito cuando clickees encima.
¿Te salió? Cuéntanos
Por cierto, las imágenes deberías meterlas dentro de un párrafo <p>, que ya que usas un XHTML estricto, también debemos serlo nosotros ;)
jimp19
Yo le quitaria los br que tienes puesto y añadiria el siguiente css:
<code>
#header2 img{
display:block;
}
</code>
si el div que contiene las imagenes se llama header2...
eso lo que hace es que la imagen se interprete como elemento de bloque y ocupe todo el ancho posible.
Mag
yo podría primero que nada:
<code>* {
margin: 0;
padding: 0;
}</code>
después para las imágenes (porque no quieres nada de espacio entre ellas)
<code>img{
border: none;
}</code>
espero que te sirva de algo...
skido
Hola...
uyyy! no ha salido la linea del doctype
<code>
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"</code>
no tengo definidos stylos para la imagenes.
solo le he puesto estos en para el div
<code>#header2 {
width: 100px;
float: left;
padding: 0;
height: 184px;
margin: 4px 0px 0px 0px;
background: #cbcc66;
}
</code>
todo esto lo quiero, xke estoy apunto de acabar mi primera web sin usar ni una sola table, y me gustarí no tenerla que poner aquí
muchisimas gracias
Mag
1 que tipo de doctype tienes+
2 tienes ya definidos estilos con css para las imagenes+
la + es una interogante que no se porque no sale en el teclado...