I'm working on a Pardot template, and in gmail at least (the only format I'm able to test in at the moment, but that's another rant), it's been adding a 6px buffer at the bottom of every image. Since we use a colored background, this results in a tiny but always visible band of white space after every image. I have identified the problem: while the image is set to be 600 x 300, the is setting it to 600 x 306. I haven't been able to identify anything in the code that causes that, so I can't tell how to eliminate it. Any ideas?
Here's the relevant code:
<td align="left" style="color:rgb(80,80,80);font-family:Arial;font-size:14px;line-height:21px;text-align:left;padding:0px"><img alt="" border="0" height="300" src="https://ci3.googleusercontent.com/proxy/X5vxonJ4LTJOIE_yqa7KPF1Q4vegN__F42lSZer12QaJPjl0e8ZdaKiCeUrYtg0UCN02hx-RkiStzH5lGhiMgI4pthDVAxOrl47N--7fyQqGVnaE-fPb5YwG3tNM-BoE2yxfbRShtN4V9mGwAOB9x4x5ERGzgSzxz1Tf7qzk_GfVSlOb=s0-d-e1-ft#https://go.homesforhomes.org.au/l/915451/2022-01-09/f5fgf/915451/1641777130w6z6vs90/600x300_image_placeholder.png" style="width:600px;height:300px;border-width:0px;border-style:solid" width="600" class="CToWUd a6T" tabindex="0"><div class="a6S" dir="ltr" style="opacity: 0.01; left: 562px; top: 1436px;"><div id=":bn" class="T-I J-J5-Ji aQv T-I-ax7 L3 a5q" role="button" tabindex="0" aria-label="Download attachment " data-tooltip-class="a1V" data-tooltip="Download"><div class="akn"><div class="aSK J-J5-Ji aYr"></div></div></div></div></td>What worked for me was to put the image inside a div and set the line height to zero.
<div style="line-height:0px;"><img></div>