I am in the process of updating an app from using CKEditor 4 to 5 (way late to the party, I know). Why does CKEditor5 wrap my images in a span tag? I am not using any image plugins, the images are supported through the GeneralHtmlSupport plugin. The span/HTML Object wrapper is affecting the flow of content and overriding some styles set on images. Is there any way to eliminate this?
CKEditor4:
<h3 class="heading-3">
Some text
<img alt="" class="img-responsive" data-src="id:1634839420011" data-cke-saved-src="https://...639d2a8b4" src="https://...639d2a8b4" style="width: 23%; float: left; display: inline; margin: 0px 10px 0px 0px;">
</h3>
<p class="large-text">Next paragraph</p>
which renders like:
CKEditor5:
<h3 class="dheading-3">
Some text
<span class="html-object-embed ck-widget" data-html-object-embed-label="HTML object" contenteditable="false">
<img class="html-object-embed__content img-responsive" style="display:inline;float:left;margin:0px 10px 0px 0px;width:23%;" src="https://...9338744" data-src="box:1634839420011" alt="" data-cke-saved-src="https://...9338744">
</span>
</h3>
<p class="large-text">Next paragraph</p>
which renders like:
I was able to get images to display the way I wanted by:
img
support though the GeneralHtmlSupport pluginimg
tags in the content