Querformat/Hochformat Bilder in E-Mail

Question

Ich schreibe eine E-Mail über Ruby on Rails und MJML Rahmen, und habe verschiedene Bilder, die ich damit aufnehmen möchte. Derzeit werden die Bilder auf S3 gehostet und wir beziehen sie im HTML-Format. Einige von ihnen sind Landschaft und einige sind Porträt, und sollte daher abgeschnitten und zentriert werden, um die gleiche Größe zu haben.

Wenn ich in einer normalen Web-Umgebung wäre, würde ich es mit regulären css methods (background-image Attribut) lösen. Aber ich möchte auch die E-Mail mit Outlook kompatibel sein (zumindest die letzte Version), die die Methode ich erwähnte isn't compatible with.

Jetzt überlege ich, die Bilder zu downloaden und dann Ernte Logik mit this gem und fügen Sie sie als Anhang. Aber ich würde mich über jede andere Alternative freuen.

Answer 1

Ich weiß nicht, ob object-fit und object-position in Outlook unterstützt werden. Ich weiß sie sind nicht in IE und Edge.

Sie können versuchen dies, wenn es unterstützt wird.

Rechtsklick auf jeden Titel und öffnet in neuem Tab das eigentliche Bild zu sehen

.image-parent { 
 
    width: 150px; 
 
    height: 150px; 
 
    overflow: hidden; 
 
} 
 

 
.image-parent>img { 
 
    width: 100%; 
 
    height: 100%; 
 
    object-position: center; 
 
    object-fit: cover; 
 
}

<a href="http://i.share.pho.to/18d84aae_o.jpeg">Landscape</a> 
 
<div class="image-parent"> 
 
    <img src="http://i.share.pho.to/18d84aae_o.jpeg"> 
 
</div> 
 
<a href="http://i.share.pho.to/eb321087_o.jpeg">portrait</a> 
 
<div class="image-parent"> 
 
    <img src="http://i.share.pho.to/eb321087_o.jpeg"> 
 
</div> 
 
<a href="http://i.share.pho.to/57896478_o.jpeg">square</a> 
 
<div class="image-parent"> 
 
    <img src="http://i.share.pho.to/57896478_o.jpeg"> 
 
</div>