Captioned Image drop near list items (ul, ol)

[Gitesh Purbia]

Steps to reproduce ¶

1. Paste image into editor
2. Move and drop image near the list item.
3. Image will be overlay on text of list items.

Expected result = ¶

Image should have some margin around image according to image alignment.

Actual result ¶

The text is hiding near image if i drop image into list item. Image a overlaping text.

Other details (browser, OS, CKEditor version, installed plugins) ¶

[Jakub Ś]

Are you by any chance talking about such code where '3' of item 3 is covered by the image?

<ol>
	<li>item 1</li>
	<li>ite<img alt="Saturn V carrying Apollo 11" src="http://c.cksource.com/a/1/img/sample.jpg" style="float:left" />m 2</li>
	<li>item 3</li>
</ol>

If yes then this is a matter of using appropriate styles on HTML and is not editor fault e.g.

<ol>
	<li>item 1</li>
	<li>ite<img alt="Saturn V carrying Apollo 11" src="http://c.cksource.com/a/1/img/sample.jpg" style="float:left" />m 2</li>
	<li style="clear:left;">item 3</li>
</ol>

In order to use such HTML you need to configure CKEditor's ACF to allow it.

var editor = CKEDITOR.replace( 'editor1', {
	extraAllowedContent : 'li{clear}'
});

Finally - CKEditor will not and should not insert such extra styles by its own.