bouton arrondi à la newsletter ne fonctionne pas dans le courrier MS

que je dois faire un bouton arrondi pour un bulletin d'information, le code HTML est d'insérer dans un outil de web base à la newsletterbouton arrondi à la newsletter ne fonctionne pas dans le courrier MS

la plupart des contenus sont ok, mais un bouton jaune avec coin arrondi sur windows 10 client de messagerie perdent l'arrondissement et le rembourrage

J'essaie d'utiliser différentes balises comme bouton ou changer pour afficher bloc et utiliser le style CSS préfixé sans succès

Si n'est pas possible i nous utilisera quelques images

<p><a href="https://mylink.com" target="_blank"><span style="display:inline-block; background-color:#ffce00; padding: 10px 45px; border-radius:20px; color: #000; font-weight: bold;">Click</span></a></p>

Source

2017-01-19 al404IT

Malheureusement, 'border-radius' n'est pas supporté dans la plupart des clients de messagerie MS, et' padding' a également un support limité - https://www.campaignmonitor.com/css/ –

vous pouvez essayer quelque chose comme ceci ci-dessous (je l'ai testé ce type de code avec succès dans MS Outlook), l'astuce est l'attribut VML arcsize

<div><!--[if mso]> 
 
    <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="http://" style="height:40px;v-text-anchor:middle;width:200px;" arcsize="50%" stroke="f" fillcolor="#ff0000"> 
 
    <w:anchorlock/> 
 
    <center> 
 
    <![endif]--> 
 
     <a href="http://" 
 
style="background-color:#ff0000;border-radius:20px;color:#ffffff;display:inline-block;font-family:sans-serif;font-size:13px;font-weight:bold;line-height:40px;text-align:center;text-decoration:none;width:200px;-webkit-text-size-adjust:none;">Click</a> 
 
    <!--[if mso]> 
 
    </center> 
 
    </v:roundrect> 
 
<![endif]--></div>

Source and Generator

Source

2017-01-19 19:09:57 dippas

D'accord, c'est la meilleure approche. 'border-radius' n'est pas supporté dans Win 10 Mail, donc VML est le meilleur pari. Plus précisément l'attribut 'arcsize'. –

Sur Windows 10 client de messagerie par défaut je vois encore (comme c'était avant) le texte avec une couleur de fond, pas de bouton arrondi. Peut-être qu'il utilise un moteur de rendu différent. – al404IT

Obtenir CSS à apparaître correctement dans les clients de messagerie est un peu pénible. Quand je faisais ce type de travail, nous utilisions ce tableau de compatibilité avant de prendre des décisions de formatage.

[https://www.campaignmonitor.com/css/]

Un autre bon outil est Litmus pour vérifier le formatage entre les clients est Litmus.

[https://litmus.com/]

Je souhaiterais avoir une meilleure réponse pour vous, espérons que cette aide.

Source

2017-01-19 19:13:20