Images html proportionnées dans Outlook

Question

J'ai un certain nombre d'images de différentes tailles que j'essaie de redimensionner et de faire proportionnées les uns avec les autres en utilisant les attributs largeur et hauteur css sur <td> éléments, puis en faisant la largeur et la hauteur des images réelles 100 % de cet élément <td>. J'essaie ensuite d'utiliser ce code dans une campagne par courrier électronique. Le problème est que ce code fonctionne correctement, comme prévu, mais Outlook semble toujours rendre les images avec leurs valeurs de largeur et de hauteur d'origine.

Est-ce que quelqu'un sait comment je peux empêcher cela.
Remarque: J'ai supprimé l'image src et les liens de mon code.

<table width="100%"> <!-- a width 100% container --> 
    <tr> 
     <td></td> <!-- an empty cell, which will adapt its width --> 
     <td width=250 height=300> <!-- it's like max-width:200px --> 
     <a href="SOME LINK"> 
     <img width="100%" height= "100%"src="SOME IMAGE LINK" alt="Just for you" title="Just for you" /> 
     </a> 
     </td> 
     <td></td> <!-- another empty cell, which will adapt its width --> 
    </tr> 
    <tr> 
     <td></td> <!-- an empty cell, which will adapt its width --> 
     <td width=250 height=300> <!-- it's like max-width:200px --> 
    <a href="SOME LINK"> 
      <img width="100%" height= "100%"src="SOME IMAGE LINK" alt="Just for you" title="Just for you" /> 
    </a> 
     </td> 
     <td></td> <!-- another empty cell, which will adapt its width --> 
    </tr> 
</table> 

Answer 1

Outlook est bancal. Il rend via WordHTML, ce qui est stupide. Le problème est que sans valeur définie dans l'attribut HTML, Outlook affiche 100% comme la largeur totale de l'image réelle (et parfois même plus grande si la résolution de votre bureau est différente de la résolution de l'image).

Votre meilleur pari est soit ensemble des requêtes des médias pour modifier la largeur/hauteur à 100% une fois qu'il atteint votre point de rupture de bureau, ou de faire quelque chose même wonkier, comme ci-dessous:

<img width="640" height="240" src="SOME IMAGE LINK" style="width:100%; height:100%" /> 

Vous remplacez juste la 640 et 240 propriétés avec la hauteur et la largeur que vous voulez votre image. La raison derrière cela est que la grande majorité des clients de messagerie respectent la cascade et placent CSS au-dessus des attributs HTML, mais Outlook, comme la bête, ignorera le CSS à 100% et travaillera sur la base de l'attribut HTML déclaré.

Maintenant ce n'est pas un message 100% infaillible et devrait être testé intensivement.

Votre solution finale, si rien d'autre ne fonctionne, consiste à redimensionner l'image d'origine à la taille maximale que vous souhaitez afficher dans Outlook.