HTML renders very differently inside different email clients. This article is a collation of different issues.
Client - Outlook
Issue: Cropped Image (img) inside a table (td). from: https://cm.engineering/fixing-bugs-with-outlook-specific-css-f4b8ae5be4f4
By default, Outlook will treat your line-height value as a minimum, and often increase it to its liking. To disable this behavior, add mso-line-height-rule: exactly; and Outlook will start to treat your line-height value as an exact value instead.
If you want this behavior for most of your email, you can simply apply mso-line-height-rule: exactly; at the <body> level, instead of repeating it throughout the email code. One drawback is that this property can make Outlook crop images by the line height. If a 200px tall image is placed in element with aline-height is 20px, and mso-line-height-rule: exactly; is in effect, Outlook will only show the bottom 20px of the image.
The solution is to revert mso-line-height-rule back to the default value at-least on any elements where it’s causing an issue.