On an existing Drupal project (v10.3.5), I can't resize the image width to < 240px
- Install and enable the CK Editor Media Resize module
- Add the Drupal Media button to the Full HTML editor
- When editing a piece of content, use the Insert Media button to insert an image
- Try to use the drag handles to reduce the image width to< 240px
I can't use the drag handles to reduce an image below 240px in width (which is not the width of my default image style (480px), nor any others). If I select the CK Editor Media Resize Mall (200px) image style, then the width is set to 240px:
I can manually edit the source e.g.:
<drupal-media class="image_resized" style="width:20px;" data-media-width="20px" data-entity-type="media" data-entity-uuid="cf7b3367-5381-4c08-9dbc-b5176c80769e"> </drupal-media>
This correctly resizes it in view mode, although when I re-edit the page the drag handles go back to 240px:
For reference, the filter processing order is:
Please note - on a brand-new Drupal project (e.g. based on https://www.drupal.org/project/drupal/releases/10.3.5 → ) there is no problem - so clearly there is something interacting with the drag handles in the existing setup limiting the width to 240px - but I just can't find what it can be.
Active
1.0
Code
UPDATE
The reason it's happening is this code in mediaembed.css:
.ck-content .media {
/* Give the media some minimal width in the content to prevent them
from being "squashed" in tight spaces, e.g. in table cells (#44) */
min-width: 15em;
}
This selector matches my Drupal image when editing, and stops it being shrunk any further than 15em = 240px. I'm unsure why this CSS isn't being loaded in my brand-new build, but regardless this _seems_ like a bug.