Crop images; activate "object-fit:cover" function

[AndreasKrause]

Hi,

is there a possibility to activate the "object-fit: cover" function in the rich Text Editor of Canvas? 
I tried to crop an image there. In the preview it worked, but when saving/publishing, the image was again only rescaled and the "object-fit" flag in the style disappeared.

See my example below. Please insert an image of choice.

<img id="2442165" style="width: 1200px; height: 200px; object-fit: cover;" src="/courses/16078/files/2442165/preview" alt="BorasSteel_140.jpg" /> the preview can be seen in the "cropped_image.png"

when saving (Updatera Kursöversikt) the object-fit flag disappears and the image is only scaled. (scaled_image_after_saving.png)

Best
Andreas

[BookerE1]

---

@AndreasKrauseDogNeedsBest wrote:

Hi,

is there a possibility to activate the "object-fit: cover" function in the rich Text Editor of Canvas? 
I tried to crop an image there. In the preview it worked, but when saving/publishing, the image was again only rescaled and the "object-fit" flag in the style disappeared.

See my example below. Please insert an image of choice.

<img id="2442165" style="width: 1200px; height: 200px; object-fit: cover;" src="/courses/16078/files/2442165/preview" alt="BorasSteel_140.jpg" /> the preview can be seen in the "cropped_image.png"

when saving (Updatera Kursöversikt) the object-fit flag disappears and the image is only scaled. (scaled_image_after_saving.png)

Best
Andreas

---

Hello,

The “object-fit: cover” function is not supported by the rich text editor of Canvas. This means that the style attribute will be removed when you save or publish your page, and the image will be rescaled to fit the container. This is a known issue that has been reported by other users.

There are some possible workarounds that you can try to crop your image and keep the aspect ratio:

• You can use an external tool, such as FreeCAD, Open3D, Artec Studio, or Python, to export or convert your image file to a different format, such as PLY, that can preserve the object-fit property.
• You can use the HTML editor in Canvas to manually add the style attribute to your image tag after you save or publish your page. However, this is not a permanent solution, as the style attribute will be removed again if you edit your page using the rich text editor.
• You can use a different image editor, such as Photoshop or GIMP, to crop your image before uploading it to Canvas. This way, you can adjust the size and aspect ratio of your image to match your desired dimensions.

I hope this helps you solve your problem.

If you have any further questions.

Please feel free to ask. Have a nice day! 

Best Regard,
BookerE1