Ver Mensaje Individual
  #1 (permalink)  
Antiguo 28/07/2011, 08:15
dooplanillo
 
Fecha de Ingreso: enero-2007
Mensajes: 64
Antigüedad: 17 años, 2 meses
Puntos: 1
Problema IE con css3 bordes redondeados y overflow

Buenas, estoy haciendo una web y como no, el explorer 7 y 8 da problemas.
Casi todos los divs de la página están con bordes redondeados y sombra via CSS3, para el Explorer solvento este problema con pie.htc y funciona bastante bien:

Código:
.cajaLittleBanner{-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; behavior: url(pie.htc); -webkit-box-shadow: 2px 2px 5px #e0e0e0; -moz-box-shadow: 2px 2px 5px #e0e0e0; box-shadow: 2px 2px 3px #e0e0e0;width:274px;height:100px;background:url(rutaImagen.jpg) no-repeat;}
El problema viene cuando la imagen ocupa todo el div. Si esta imagen va mediante css como el ejemplo de arriba, no hay problema, se redondean las esquinas sin problemas, el tema viene si la imagen va directamente en el código html
Código:
<div id="etiqueta"><img src="imgRuta" /></div>
En este caso, al poner en las css de #etiqueta un overflow:hidden; el problema se soluciona en firefox, opera, mozilla, y todos los navegadores del universo menos el que ya sabemos.
[CODE]#etiqueta{-moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; behavior: url(pie.htc); -webkit-box-shadow: 2px 2px 5px #e0e0e0; -moz-box-shadow: 2px 2px 5px #e0e0e0; box-shadow: 2px 2px 3px #e0e0e0; overflow:hidden;}

Alguna idea???

Muchas gracias

Última edición por dooplanillo; 28/07/2011 a las 08:34