CKEditor尊重块元素

Question

我正在尝试让CKEditor尊重像div这样的块元素，但我无法管理它。

以下是我使用的示例代码

<div class="row" >
<div class="col-md-12">
<h1><img alt="" src="http://placehold.it/252x337" style="margin-left: 10px; margin-right: 10px; float: left; width: 252px; height: 337px;" />What is it?</h1>

<p><span style="color: rgb(0, 0, 0); font-family: Arial, Helvetica, sans; font-size: 11px; line-height: 14px; text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor elit venenatis tristique mollis. Ut quis ipsum lectus. Curabitur vestibulum, ipsum ac molestie posuere, dolor est faucibus risus, id volutpat nisi magna vel velit. Pellentesque vel interdum mi. In justo erat, hendrerit a ultricies nec, pharetra vitae nisl. Fusce vel purus risus. Etiam porttitor varius turpis, sed vehicula arcu aliquam eu. Morbi vehicula euismod nibh, ut semper nulla sollicitudin a. Morbi vitae tellus auctor, sollicitudin arcu sed, porta urna. Maecenas eu scelerisque orci. Proin vitae lobortis nisi, at suscipit mauris. Nam eu ultrices velit, nec mattis velit. Ut feugiat lorem lectus, nec feugiat justo ultricies non.</span></p>
</div>
</div>
<!-- /row -->

<div class="row" >
<div class="col-md-12">
<h1>Lorem</h1>

<p><img alt="" src="http://placehold.it/168x113" style="margin: 0px 10px; float: right; width: 168px; height: 113px;" /><span style="color: rgb(0, 0, 0); font-family: Arial, Helvetica, sans; font-size: 11px; line-height: 14px; text-align: justify;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus tempor elit venenatis tristique mollis. Ut quis ipsum lectus. Curabitur vestibulum, ipsum ac molestie posuere, dolor est faucibus risus, id volutpat nisi magna vel velit. Pellentesque vel interdum mi. In justo erat, hendrerit a ultricies nec, pharetra vitae nisl. Fusce vel purus risus. Etiam porttitor varius turpis, sed vehicula arcu aliquam eu. Morbi vehicula euismod nibh, ut semper nulla sollicitudin a. Morbi vitae tellus auctor, sollicitudin arcu sed, porta urna. Maecenas eu scelerisque orci. Proin vitae lobortis nisi, at suscipit mauris. Nam eu ultrices velit, nec mattis velit. Ut feugiat lorem lectus, nec feugiat justo ultricies non.</span></p>
</div>
</div>

这是结果

这就是我期待的样子

我还尝试将div的宽度设置为100％，但它不起作用。 据我所知，块元素占用尽可能多的空间。但它似乎在CKEditor中不起作用。 那么有可能实现我想做的事情吗？

Answer 1

您的代码应该按预期行事：http://jsfiddle.net/b08yhh56/。第一个图像浮动，将其从正常的文档流中取出，其他所有图像都在它周围流动。这与CKEditor无关。

要获得结果，您需要向后续div http://jsfiddle.net/b08yhh56/1/添加clear:left