Image Scaling with percentage in WYSIWYG Editor

[DReffects2]

Hey Guys,

so I am constantly having the issue that I'd like to align an image in the wysiwyg editor left or right and in order to have it a pleasant size I have to use absolute pixel values for resizing.

This leads to serious issues with responsive layouts, especially on a mobile device. Take a look at this screenshot:

The image is 300px wide - that's about 30% of the space that's available on a desktop computer and my desired text to image ratio:

Now the whole issue would not exist if I'd be able to specify the image width not in pixels but in percent.

With the current setup the css needs to be modified like this:

<a class="ipsAttachLink ipsAttachLink_image ipsAttachLink_right" data-fileid="4474" href="https://www.scifinews.de/uploads/monthly_2017_11/image.png.1e086fc3f939987e8e6865c2638b67af.png" rel="" style="float: right; width:30%;"><img alt="image.png" class="ipsImage ipsImage_thumbnailed" data-fileid="4474" data-unique="wm9tdlt4m" src="https://www.scifinews.de/uploads/monthly_2017_11/image.thumb.png.cfe70849be38725d1a758a1607aa255b.png" style="width: 300px; height: auto;"></a>

This then results in the same look and feel for desktop AND a usable output for mobile:

Would be great if you could make this an option with the wysiwyg editor asap

What do you guys think?

 

[Joel R]

I have this issue too when writing articles with images.  I usually hardcode the image's width to not be more than 196 pixels, which looks okay on mobile.  

[InsideEdge]

I've added this CDK editor addon to resize images, it works well.

https://ckeditor.com/cke4/addon/imageresize