Fixed EmailRenderer stripping inline width tags from images (#18587)

no issue

- product card outputs the original width/height of the image in emails
which results in overflown images in Outlook
- Combined with https://github.com/TryGhost/Koenig/pull/983/files, this
change fixes rendering for product card images in Outlook

---------

Co-authored-by: Sodbileg Gansukh <sodbileg.gansukh@gmail.com>

ghost/email-service/lib/EmailRenderer.js

@@ -370,8 +370,8 @@ class EmailRenderer {
 
         // Juice HTML (inline CSS)
         const juice = require('juice');
-        juice.heightElements = ['TABLE', 'TD', 'TH'];
-        juice.widthElements = ['TABLE', 'TD', 'TH'];
+        juice.heightElements = ['TABLE', 'TD', 'TH', 'IMG'];
+        juice.widthElements = ['TABLE', 'TD', 'TH', 'IMG'];
         html = juice(html, {inlinePseudoElements: true, removeStyleTags: true});
 
         // happens after inlining of CSS so we can change element types without worrying about styling

ghost/email-service/lib/email-templates/partials/styles-old.hbs

@@ -637,8 +637,7 @@ a[data-flickr-embed] img {
 .kg-image-card img {
     display: block;
     margin: 0 auto;
-    width: auto;
-    height: auto !important;
+    height: auto;
 }
 
 .kg-bookmark-container {

ghost/email-service/lib/email-templates/partials/styles.hbs

@@ -685,8 +685,8 @@ a[data-flickr-embed] img {
 .kg-image-card img {
     display: block;
     margin: 0 auto;
-    width: auto;
-    height: auto !important;
+    /* width: auto;
+    height: auto !important; */
 }
 
 .kg-bookmark-container {