-
Posts
-
Hello,
I’m using a 1/3 column with an image inside to display an image next to some text on my website. In addition, I adjusted the image size to 180x180px, which is the perfect size for Desktop.
However, the image looks too large on Mobile screens. I don’t see an option to select a different size (Responsive) for Mobile for this. How do you recommend to adjust it so that the specific image shows smaller on Mobile? (I’m saying specific image as it should only be applied to some images and not all)
Thank you,
MarkusHey markus-fischer,
Thank you for the link to your site, but since your screenshot requires a login we can not see it.
Please try not to require a login for your screenshots so we can see them.
So I guess that you are talking about the light bulb image on your site for mobile, since it is for a “specific” image the WordPress image class for this image is wp-image-3399 so this css will reduce it’s size below 430px:@media only screen and (max-width: 430px) { .wp-image-3399.avia_image { max-width: 50%; max-height: 50%; margin: auto; } }After applying the css, please clear your browser cache and check.
If you have a group of these images you can add a custom class in the advanced options of the image element and use it instead of the WordPress image class in the css.Best regards,
MikeThank you Mike, that works perfectly now!
Apologies for the screenshot sharing – I thought I had it enabled to be visible. Will double-check next time.
Best regards,
MarkusHi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike
- The topic ‘Adapt Image Size for Mobile’ is closed to new replies.