2011-08-22 57 views
5

He estado diseñando un boletín informativo, y mientras el radio del borde funciona en mi servidor local (mostrando todos los bordes de las rondas), pero no funciona cuando se prueba mediante correo electrónico de muestra. Me envié un correo electrónico usando el correo yahoo y Firefox, salió con bordes afilados. Tampoco funciona en Outlook 2007.Border-Radius no funciona en Correo electrónico y navegador

¿Alguien sabe cómo resolver este problema? Apreciaré tu ayuda.

+0

Pregunta duplicada, http://stackoverflow.com/questions/7089248/email-newsletter-not-rendering-correctly/7089327#7089327 –

Respuesta

4

Nunca funcionará en Outlook 2007, ya que utiliza palabras como renderizador, que no admite la mayoría de las CSS.

Para Firefox, debe agregar el prefijo -moz-, asegúrese de haberlo hecho.

Si no, publique su versión de css y firefox.

+0

Gracias por su consejo - agregará eso ahora. Además de agregar el 'moz-' para permitir que se muestre en Firefox, ¿hay algún otro método más simple para crear bordes redondos que puedan mostrarse en outlook? Usé un código y era demasiado largo, por lo que algunos recomendaron utilizar border-radius. Resulta que no funciona Outlook :-( – Julie

+0

lo único que puedes hacer son imágenes, esto es lo mejor para los correos electrónicos, ya que significa que funcionará en cada cliente de correo electrónico de imagen. Los clientes de correo electrónico basados ​​en web como Yahoo y Gmail solo usan el navegador como el cliente de representación. – rickyduck

+0

Gracias de nuevo, parece la única opción ahora. Saludos de todos modos. – Julie

0

Los boletines de las herramientas de campaña de correo electrónico (Outlook, Gmail, Hotmail) tienen menos compatibilidad con CSS. Además, border-radius es compatible con navegadores web, no para clientes de correo electrónico.

Es mejor utilizar imágenes de fondo, imágenes puras, degradados, esquinas redondeadas y elementos relacionados con 3D en lugar de usar estilos CSS.

Ver esta referencia: Campaign Monitor

Esta remisión se desprende que la propiedad CSS es apoyada por diferentes clientes de correo electrónico.

Ver otras referencias: Email newsletter not rendering correctly

2

no creo que Outlook 2007 apoyo la propiedad border-radius, por lo que es probable que sea normal si no muestra las esquinas redondeadas. Si usted está buscando una solución, le sugiero que para echar un vistazo a esta pregunta: How can I make rounded corners on non-CSS3 browsers?

Para la CSS en los navegadores modernos, actualmente necesita el prefijo ciertos parámetros fisico, por ejemplo:

.withRoundedCorners { 
    border-radius: 5px;  // Standard 
    moz-border-radius: 5px; // Firefox 
    khtml-border-radius: 5px; // 
    o-border-radius: 5px;  // Opera 
    webkit-border-radius: 5px; // Safari 
    ms-border-radius: 5px;  // Internet Explorer 9+ 
} 

I Sé que es aburrido ... Pero es temporal, en el futuro solo se requerirá border-radius.

+0

Lo usaré cuando trabaje en un navegador. Por ahora, me centraré en las perspectivas, eso es lo que usan nuestros clientes objetivo. Saludos por los consejos. – Julie

Cuestiones relacionadas