When creating content in a RTF field you have the option to insert tables and images. An Image is added to the RTF field with a fixed with of 100%. How can we manipulate that ?
<p>
<img src="tcm:30-1737" title="320x198" alt="320x198" class="pull-left"/>
Lorem Ipsum dollar - met nog meer content :)
</p>
Output in HTML
<img src="/media/320x198_tcm30-1737_w1024_n.png" alt="320x198" data-aspect="0" width="100%">
It is currently logged as a defect https://github.com/sdl/dxa-web-application-java/issues/41 (issue is available in both Java and .NET versions DXA), and we are looking at solving it in the upcoming 1.5 release (but no promises currently about that).
The HTML for (embedded) Images is rendered by the (Core) Image View, so that is where it can be modified. https://github.com/sdl/dxa-modules/blob/master/webapp-java/dxa-module-core/src/main/resources/META-INF/resources/WEB-INF/Views/Core/Entity/Image.jsp
Note that the Image View Model has a property which indicates whether it's embedded in Rich Text or not. This can be used in the View to render different HTML if needed. See, for example: https://github.com/sdl/dxa-modules/blob/master/webapp-java/dxa-module-core/src/main/resources/META-INF/resources/WEB-INF/Views/Core/Entity/YouTubeVideo.jsp
<figure>tag around it too? but I have a feeling this is a defect where DXA fails to support the left, right and center alignment of images in an article RTF as mentioned in the whitelabel HTML design.