It seems like Content Builder adds its own <img src...>
tag with standard attributes. Everytime a new image is replaced or added using the UI this happens to be the case.
To resolve this behaviour you'd created a class and set it to the wrapping <td>
or <table>
since these HTML tags don't get affected by the UI
For example:
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" class="ImageAuto"><img src="http://unsplash.it/g/600/400?text=BANNER" width="100%" border="0" alt="BANNER" style="display:block;" /></td>
</tr>
</table>
Above code, you can see the <image>
tag being wrapped around <td>
which won't be replaced or altered by the Content Builder UI. You can then use the class ImageAuto
in your media query to handle the height of the image.
For example:
.ImageAuto img {
height: auto !important;
width: 100% !important;
}