Twenty Twenty – Image Size

I have the same issues and have recently posted a question about this. No reply either.
https://www.ads-software.com/support/topic/block-image-sizes-normal-behavior/

Have you been able to resolve the issue or have you found CSS that helps?

I have added custom classes and tried styling the image, which works on desktop but then looks weird on mobile.

Thanks,

Hi @edwardjonesdesign

Good to hear from you ??

No, I haven’t found any solution for this issue.

The custom classes that you mentioned, do you directly add those in Theme Editor? Can you share it with me ?? I’m not that confident in making changes on Theme Editor but I would really like to solve this issue.

Thank you so much and looking forward to your reply.

Hello jhosalazar –

I did end up going with this to fix theme not allowing us to change sizes of images when set to align right or align left. Add the css below to your ‘appearance/customize/additional css’ and let me know if it helps:

/*Img Wrap*/
.alignright, .alignleft {
min-width: 33rem !important;
}
@media screen and (max-width: 600px) {
.alignright, .alignleft {
float: none !important;
margin: auto !important;
text-align: center !important;
}
}

This uses the wordpress class names and you can try adjusting the scale of image to fit your template and also set the small screen break point to align these center instead of being pushed left or right (I like 600px as above).

If you want to add your own class name, or only set this to certain images, this can be done in the editor – select the block you want a custom name for and then on the right column of editor look for ‘advanced’ under block settings (note – block setting are next to ‘page’ at top right). Under advanced you will see ‘Additional CSS class(es)’. enter you class name there and change the css above (.alignright, .alignleft) to call your class name, i.e. ‘.image-wrap’

It worked for me too, @edwardjonesdesign

Thank you so much for your help!!!! Really, really appreciate it ??