Foros del Web » Creando para Internet » CSS »

Alguien me explica por qué IE me hace esto?

Estas en el tema de Alguien me explica por qué IE me hace esto? en el foro de CSS en Foros del Web. Hola, tengo algo muy simple: Código: <a href="http://.../" class="banners"><img src="1.jpg" alt="" width="150" height="50" border="0" /></a> <a href="http://.../" class="banners"><img src="2.jpg" alt="" width="150" height="50" border="0" /></a> .banners ...
  #1 (permalink)  
Antiguo 04/07/2006, 14:46
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Alguien me explica por qué IE me hace esto?

Hola, tengo algo muy simple:

Código:
<a href="http://.../" class="banners"><img src="1.jpg" alt="" width="150" height="50" border="0" /></a>
<a href="http://.../" class="banners"><img src="2.jpg" alt="" width="150" height="50" border="0" /></a>


.banners {
	display: block;
	width: 154px;
	padding-top: 2px;
	padding-bottom: 2px;
	background-color: #E1E1E1;
	text-align: center;
	margin-bottom: 5px;
	/* EL BORDE LO PUSE PARA VER SI ERA UN PROBLEMA CON LOS MARGENES QUE COLAPSAN */
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #000000;
}
.banners:hover {
	background-color: #FCA000;
}
Lo pueden ver aquí: http://personal.alzuwaga.com.ar/ (son los banners de la derecha)
Si se fijan con IE, este tiene un comportamiento extraño... como que se mueven las imágenes.
¿Cuál es el problema? ¿Y la solución? :)

Gracias
__________________
...___...

Última edición por AlZuwaga; 04/07/2006 a las 15:59
  #2 (permalink)  
Antiguo 04/07/2006, 16:00
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Edité el código de arriba, decía margin y era margin-bottom: 5px

Bueno, en vez de un margin-bottom le puse un margin-top de 5px y funciona... ¿raro o no?
__________________
...___...
  #3 (permalink)  
Antiguo 04/07/2006, 16:45
 
Fecha de Ingreso: julio-2006
Mensajes: 3
Antigüedad: 11 años, 5 meses
Puntos: 0
De acuerdo Permiteme tantito..

oye master..
el css que tienes en el sitio dice lo siguiente en la parte del
.banners:


.banners {BORDER-TOP: #000000 1px solid; DISPLAY: block;
PADDING-BOTTOM: 2px;

MARGIN: 0px 0px 5px;

WIDTH: 154px; PADDING-TOP: 2px; BACKGROUND-COLOR: #e1e1e1; TEXT-ALIGN: center}
.banners:hover {BACKGROUND-COLOR: #fca000}

Lo UNICO que necesitas hacer es:
corregir la indicacion de margenes que esta incompleta, ya que el iexplorer
la esta "interpretando" como mejor cree que debe estar..

o sea:

MARGIN:0px 0px 0px 5px;

Solo tienes que agregarle el tamaño..
no recuerdo la definicion, pero
creo que debes revisar cual es la regla para
el número de atributos al especificar bordes,
si es uno aplica a todos
si son dos.. etc..

Saludos desde Merida Yucatan.. Espero te sirva de algo

  #4 (permalink)  
Antiguo 04/07/2006, 16:55
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Qué raro, porque yo veo esto en el CSS:

Código:
	margin-bottom: 5px;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
__________________
...___...
  #5 (permalink)  
Antiguo 04/07/2006, 17:10
 
Fecha de Ingreso: julio-2006
Mensajes: 3
Antigüedad: 11 años, 5 meses
Puntos: 0
ah ok

ahhh

...

yo revise la version de las.. mm caramba!.. como a las tres de la tarde (creo)
antes de que pusieras la correccion de los margenes:

las dos definiciones son iguales;
solamente que la que tu pones es más específica, cualquiera de las dos esta bien, ya que ambas son aceptadas en las reglas del css (w3c)
ahh.. entonces la respuesta llegó tarde jejeje.. disculpa

pero no importa, lo importante es que ya funciona y ya sabemos porque

saludos
  #6 (permalink)  
Antiguo 04/07/2006, 17:19
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Pero no he tocado nada del archivo de muestra!
O sea, siempre estucvo así:

margin-bottom: 5px;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;

que es como yo lo deseo, pero así no funciona bien con IE

pero para que funcione sin inconvenientes en ie debo ponerlo así:

margin-bottom: 0px;
margin-top: 5px;
margin-right: 0px;
margin-left: 0px;

Y realmente me gustaría controlar a gusto y piacere el margen inferior... no el superior.

en realidad, es casi lo mismo... pero al menos me gustaría saber si es algún bug conocido o qué. Igual, como puse un css para IE, voy a dejarlo funcionando como yo quiero para FF y a el otro le pongo que tome el margen superiuor en vez del inferior.

Gracias
__________________
...___...
  #7 (permalink)  
Antiguo 04/07/2006, 18:23
Avatar de Developer9
(Desactivado)
 
Fecha de Ingreso: abril-2005
Ubicación: Mi Ecuador del alma
Mensajes: 4.196
Antigüedad: 12 años, 7 meses
Puntos: 47
Cita:
Iniciado por Al_Zuwaga
Alguien me explica por qué IE me hace esto?
Será porque no lo tratas con cariño

Última edición por Developer9; 04/07/2006 a las 19:29
  #8 (permalink)  
Antiguo 04/07/2006, 19:24
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
En realidad es aquel el que no trata con cariño ni respeta mis "obras de arte" ¬¬


No, por favor.. no se lo crean! jajajaja
__________________
...___...
  #9 (permalink)  
Antiguo 04/07/2006, 19:29
Avatar de Developer9
(Desactivado)
 
Fecha de Ingreso: abril-2005
Ubicación: Mi Ecuador del alma
Mensajes: 4.196
Antigüedad: 12 años, 7 meses
Puntos: 47
Cita:
Iniciado por Al Zuwaga
En realidad es aquel el que no trata con cariño ni respeta mis "obras de arte" ¬¬


No, por favor.. no se lo crean! jajajaja
je je... tranqui, no tienes que decirlo. Oye Daz, paginas como la del foro las veo igual en ambos exploradores, ustedes que son escandalosos Hasta luego

PD: vamos vamos Argentina
  #10 (permalink)  
Antiguo 04/07/2006, 20:38
Avatar de AlZuwaga
Colaborador
 
Fecha de Ingreso: febrero-2001
Ubicación: 34.517 S, 58.500 O
Mensajes: 14.550
Antigüedad: 16 años, 9 meses
Puntos: 535
Dev... ocurre que el foro tiene las mil y una tabla para maquetar el sitio... yo no tengo ni una. Eso es lo "complicado"... pero lo mejor: lo estandard
__________________
...___...
  #11 (permalink)  
Antiguo 05/07/2006, 03:09
Avatar de axiertxo  
Fecha de Ingreso: octubre-2005
Ubicación: España
Mensajes: 387
Antigüedad: 12 años, 1 mes
Puntos: 0
Hola,

Pon el código html todo junto así

Cita:
<DIV id=derecha>

<A class=banners href="http://www.paralavictoria.com.ar/"><IMG height=50 alt="Equipos Para La Victoria" src="Ciudadanía Para Crecer_archivos/equipos-para-la-victoria.jpg" width=150
border=0></A><A class=banners href="http://www.fam-online.org/"><IMG height=58 alt="Federación Argentina de Municipios" src="Ciudadanía Para Crecer_archivos/logo-fam.png" width=150 border=0></A><A class=banners href="http://www.laplata.gov.ar/"><IMG height=58 alt="Municipalidad de La Plata" src="Ciudadanía Para Crecer_archivos/logo-la-plata.png" width=150 border=0></A><A class=banners href="http://www.ensenada.gov.ar/"><IMG height=50
alt="Municipalidad de Ensenada" src="Ciudadanía Para Crecer_archivos/logo-ensenada.png" width=150 border=0></A>
</DIV>
y los estilos asi

Cita:
.banners {
BORDER-TOP: #000000 1px solid;
DISPLAY: block;
PADDING-top:2px;
PADDING-bottom:2px;
BACKGROUND-COLOR: #e1e1e1;
margin-bottom: 5px;
margin-top: 0px;
margin-right: 0px;
margin-left: 0px;

}

.banners:hover {
background:#FCA000;

}

Saludos
__________________
El mundo exige resultados. No le cuentes a otros tus dolores del parto. Muéstrales al niño.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 08:13.