[GBrassQ]

Hello,

I am using WP 6.4.3 and very few plugins with Chique Music theme. The block images aren’t responsive. Any ideas on how to fix this?

Desktop screenshot:

https://imgur.com/a/gmmT832

 

Mobile screenshot:
https://imgur.com/a/ffbWpjj

[tikaram]

@gbrassq : Please post in your site URL so that I can check for issues on your site and provide you the required fix.

Regards,
Tikaram

[GBrassQ]

https://goldbrassquintet.com/
This is the website.

Thank you

[tikaram]

@gbrassq : I checked your site on a mobile device and I don’t seem to find any issues with images on mobile devices. Can you please check your site again and let me know. I have attached the screenshot of the page as mentioned above.

Regards,
Tikaram

[GBrassQ]

Thank you for your time Tikaram.
If you use developer tools, and mimic Mobile behaviour in desktop you will see the distortion of the text that renders with the image. The image is not downscaling.

https://imgur.com/a/uYx0L2l

I used a pixel 7 emulator to reproduce the error.

[tikaram]

@gbrassq : Can you please try testing it from a mobile device and provide me device details so that the actual results can be obtained rather than from developer tools or emulators.

Regards,
Tikaram

[GBrassQ]

Sure thing.

https://imgur.com/a/zv5S05V

iPhone xR 2018  from the browser Safari.

As you see, the image should shrink a little to allow more text to be displayed. The image is not shrinking, it is staying at 245 px

 

Thank you for your help

[tikaram]

@gbrassq :  I will check for the issue and get back to you soon.

Regards,
Tikaram

[tikaram]

@gbrassq : Login to your WordPress admin section. Go to Appearance => Customize => Additional css and add the following additional css.

/* Max Width for Left and Right Aligned Image in Smaller Devices */
@media screen and (max-width: 960px) {
  .wp-block-image figure.alignleft,
  .wp-block-image figure.alignright {
    max-width: 30%;
  }
}

Please try increasing or decreasing the value of max-width as per your design needs

Regards,
Tikaram

[GBrassQ]

Thank you  Tikaram.

 

That worked. I appreciate your wisdom!

[Author]

Posts