PIE CSS3: ¿No está funcionando la compatibilidad con IE border-radius?

Estoy tratando de hacer esquinas redondeadas en IE con el comportamiento adjunto CSS3 PIE .

Aquí está mi CSS:

.fieldRow { clear:both; padding: 0; margin: 0; overflow: hidden; line-height:17px; } .alternate, .rowMousedOver { -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; behavior: url(PIE.php); position: relative; } .rowMousedOver{ background-color: #E2E66D !important; } .alternate { background-color: #FCFEE8; } 

y aquí hay un ejemplo de HTML:

 

y a través de javascript agrego rowMousedOver a fieldRow cuando está fieldRow .

¿Alguna idea de por qué esto no está funcionando? También intenté usar el behavior: url(PIE.htc) , pero tampoco tuve suerte con eso.

¡Gracias!

Las solicitudes PIE.htc deben responder con el tipo de mime “text / x-component” – o IE no tocará el comportamiento. El PIE.php que uses debería arreglar esto. Si no está seguro de que este sea el caso, use la función de red de FireBug para verificar una solicitud directa al archivo.

También tenga en cuenta que la ruta a PIE.htc es relativa A LA PÁGINA HTML, no relativa al archivo css que usted esperaría. Así que considere hacer el camino al .htc absoluto. Aquí FireBug puede volver a ayudarlo a detectar si tiene un problema 404.

Más información en http://css3pie.com/documentation/known-issues/

Intente agregar una position: relative en su statement css. He tenido ese problema un par de veces y normalmente se resuelve haciendo eso. Se puede encontrar más información en: http://css3pie.com/documentation/known-issues/

Prueba agregar

 position:relative; z-index: 0; 

como se sugiere aquí http://css3pie.com/forum/viewtopic.php?f=3&t=10

El problema puede estar en su camino, dependiendo de dónde coloque el archivo PIE.htc. Tenga en cuenta que la documentación de “inicio” de Pie ( aquí ) menciona lo siguiente:

… deberá ajustar la ruta para que coincida con el lugar donde cargó PIE.htc en el paso 2. Nota: esta ruta es relativa al archivo HTML que se está viendo, no al archivo CSS desde el que se llama.

Así que behavior: url(PIE.htc); debería funcionar si el archivo PIE.htc está en la misma carpeta que su archivo html (al menos, funcionó para mí :-)).

Sin embargo, no estoy seguro de lo que quiere ver redondeado … el div que se vería afectado no parece tener ninguna característica visible. Si desea ver el div con esquinas redondeadas, puede hacer que el borde o fondo sea visible, como agregar border: 1px solid black; o background-color: someColor; a la clase de Fieldrow.

Si desea ver redondeado el campo de entrada, es posible que desee declarar la clase como .fieldRow input {...}

La respuesta de Neophyte aquí (para usar un comentario condicional en la sección principal) me ayudó cuando todo lo demás parecía estar bien / no hacía la diferencia (en las páginas de prueba más simples, desde IIS 7 con IE8)

http://www.webmasterworld.com/forum83/9144.htm

Espero que ayude a alguien

También vale la pena señalar: tuve un problema donde las esquinas redondeadas no estaban funcionando en lte IE8 cuando establecí un color de fondo con una regla !important después de esto. ¡Otra razón para no usar! ¡Importante!

Una solución que funciona para mí es la siguiente:

  1. La ruta de acceso a PIE.htc debe ser absoluta, por ejemplo, comportamiento: url (App_Themes / Default / PIE.htc)
  2. Asegúrate de que el div en el que estableces el comportamiento tenga un estilo de Posición: relativo

Dan