Copy/paste in CKeditor adds junk styles (e.g. width) which breaks responsive design

[Mojmír Ďurík]

Hi,

Let's say in ckeditor/contents.css are defined following styles:

body {

width: 1000px;

}

.responsive-block {

width: 50%;

}

Then if in ckeditor you copy (of course in visual mode, not from source code):

<div class="responsive-block">...</div>

and you paste it to some other place you will get:

<div class="responsive-block" style="width:500px">...</div>

This breaks responsive design.

Provided example deals with width but junk styles are also added for font-size, line-height, ... which also could be changed by responsive styles.

I understand that in some circumstances this behaviour is desired but on other side there are circumstance when this behaviour breaks responsive design. So if this is not considered as bug it would be great at least have possibility to "paste without addition of explicit inline styles" or "paste unchanged" and let the user decide what he will do.

Thank you.

Mojmir Durik

[Jakub Ś]

I'm unable to reproduce issue with styles but because of "line-height" style pasted on copy/paste I think you are using allowedContent : true and Chrome.

You have asked what can you do:
For starters, please don't use allowedContent:true but use extraAllowedContent: 'div{responsive-block}' ( div{*} allows all classes).

About styles - are you using any custom plugins or have made some code changes to the editor. I'm asking because I can't reproduce this in default CKEditor.

Because of above, I'm closing this issue as invalid. @mojo3159 feel free to leave a comment that will help me reproduce this issue in default editor.