tengo un problema (el primero paso es reconocerlo).
Primero lo que quiero hacer:
tengo una cabecera para mi página, que va a contener 2 fotos, dispuesta en la misma línea horizontalmente. Sencillo
Mi código (resumido, para las zonas comprometidas)
html:
Código :
<div id="div_header"> <img style="float:left" src="images/title2.gif"> <img style="float:right" src="images/ball2.gif"> </div>
css
Código :
#div_header { height:100px; width:894px; background-color:#99FF99; padding:0px; margin:0px; }
Tamaño imágenes: 772x100 y 122x100
En FF funciona correctamente, en el sentido en que coloca una imagen justo después de la otra, y ajustando al máximo a los bordes (izqdo y drcho) del div que las contiene.
En cambio, con IE me mete un peqeño margen a la izquierda y a la derecha y entre las fotos, de forma que la 2ª foto me la baja a la siguiente línea. Para que queden las 2 en la misma línea, he de poner un ancho a "div_header" de 906px, con lo que el total de pixels que me añade están siendo:
906 - 766 - 122 = 12 pixels, supongo que 3 pixels por cada lado de cada imagen.
Conseguí solucionar esto poniendo un margin negativo de 3 pixels a cada lado, pero además de ser una chapucilla (supongo que habrá otro método), en el Mozilla me jodía todo. Para solucionar esto a su vez intente usar los "comentarios adicionales" que he descubierto a través de vuestro foro, pero lo que había dentro del comentario lo obviaba tanto el IE como el FF.
Es posible que esto lo hayan preguntado antes por ahí, pero de verdad que no he encontrado nada que me haya sido útil.
Muchas gracias de antemano.