Modal toggle image contain


I’m creating a page with a lot of modals which should be triggered with an image toggle. However when using an image, the image doesn’t fit to the column (it crops the image if the image is to wide). Can I somehow set it to “contain” so that the image will adapt to the width of the column?

Hello @Kobber,

Thanks for writing in! There isn’t an option to set the background size or object fit in the Toggle. What you can do is to insert an inline css in your Modal element, Modal > Customize > Element CSS and add the following:

$el.x-anchor .x-graphic {
    max-width: 100%;

The code above serves as an example code. Feel free to modify it when needed. Please note that custom coding is beyond the scope of our support. You will have to maintain any custom coding to make sure that it will still work after any updates or does not create any issues or incompatibility in the future.

Kindly let us know how it goes.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.