Image dialog sets size using style attribute

[Matthew Leffler]

The image dialog sets size using the style attribute. This makes it hard to override or limit the size using css.

Steps:

1. Viewing the demo, click the image button.
2. Browse server and select an image.
3. Ok out the dialog.
4. View source.

Expected result:

The size should be set using attributes.

Actual result:

The size is set using the style attribute.

Notes:

If the dialog did not set the image size when it was select from browsing the server it would help. That would allow css like the following to be effective:

{{{text/css img {

max-width: 100%; height: auto;

} }}}

As it currently stands the images are squashed at the containers max-width and the height of the style attribute on the image. I must add an !important to the style to enforce the aspect ratio.

[Matthew Leffler]

Apologies, I pressed Create when I meant Preview. Example CSS should be as follows:

img {
    max-width: 100%;
    height: auto;
}

The bottom line is that this:

<img alt="" src="/userfiles/images/Mouse.jpg" height="344" width="440" />

is preferable to this:

<img alt="" src="/userfiles/images/Mouse.jpg" style="height:344px; width:440px" />

[Jakub Ś]

From CKEditor 4.1 it depends on ACF. In fact even in CKE 3.x you could use one of workarounds provided here #5547.

In version 4.1 we have introduced ACF. Please see:
​http://ckeditor.com/blog/Upgrading-to-CKEditor-4.1
​http://ckeditor.com/blog/CKEditor-4.1-RC-Released
​http://docs.ckeditor.com/#!/guide/dev_advanced_content_filter
​http://docs.ckeditor.com/#!/api/CKEDITOR.filter-method-addTransformations
​http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-allowedContent
​http://docs.ckeditor.com/#!/api/CKEDITOR.config-cfg-extraAllowedContent

The bottom line is that as of 4.1 you can set your own rules or transformations. Yes, by default styles are preferred but you can change this easily with ACF rules.