Deactive responsive images

Archimede · March 7, 2023, 6:31pm

Hello, I’m having some issue with images being displayed at low resolution when I put them in a grid or I use relative size for width or height (such as height: 30vw);

I read that there should be a button to enable/disable responsive images, which I believe is what is causing the problem, however, I haven’t been able to find this setting anywhere.

Can you help me understand how to disable responsive images?
thanks

theecarls · March 7, 2023, 7:23pm

There’s a couple steps before you can get the checkbox to appear. Here you go!

Select the image on the Webflow canvas.
Type Command + Shift + O (on Mac) or Control + Shift + O (on Windows)
Open Settings panel > Image settings.
Uncheck the Responsive image checkbox.

Archimede · March 15, 2023, 11:32pm

@theecarls Thank you for the reply, I’ve tried it but for images inside components the checkbox doesn’t appear, am I missing something?

theecarls · March 16, 2023, 1:10pm

It should be working if you’re in the right area. The checkbox will appear here:

Here’s the full walkthrough from WF University: Responsive images in Webflow | Webflow University

AkbarSuriagandaCX · June 7, 2023, 3:36pm

I also have this problem and the WF University link doesn’t really help this case.
When pressing CMD+SHIFT+O on an image element outside a component, it works:

But when I do this in a component, it doesn’t. The settings even look different:

Am I not in the “right area”? Or is deactivating responsive images within a component not possible?