Not the answer you're looking for but I'm not aware of any good solution for this problem. I would probably just tell the frontend team to wrap images, or add a CSS-file in edit mode only, that works around the layout problem :). In my opinion, it's not worth the time and money to try to "hack" the CMS in cases like these. I usually just add an edit mode only CSS if I don't have control over the frontend code myself.
In my opinion we should have total control over the output :) That's why we in the first place are replacing the default property renderer so it behaves more like the webcontrol in WebForms, i.e. always wraps the property, even in view mode (if we specify CustomTag [sic]). So just adding an edge case for images is not a big effort... if we get it to work of course.
We're not just doing this to get a nice output... we're mostly doing this to make the editing experience awesome for our editors.
I'm soooo looking forward to .NET Core where we have tag helpers and hopfully more control over this. But still, images will probably be an issue since the value of an image is not the inner HTML.
I agree, of course, that total control over the output is the ideal thing. And it's really strange that we don't, out of the box, have the possibility to always wrap the property the same way in both edit, preview and view mode.
I was only hinting that it will probably (not definitely) be a bigger effort than you can imagine. :) If you find a nice solution, I would be very interested in it.
I have a blog post about wrapping elements in view mode http://dodavinkeln.se/post/propertyfor()-revisited