cjg89
commented
3 years ago Hi @bwpate , we'd suggest applying the .img-fluid class, which applies max-width: 100%; height: auto; to images with this problem: https://ucf.github.io/Athena-Framework/content/images/#responsive-images
We intentionally don't apply these styles globally to <img> tags in our Athena-based themes to prevent conflicts with other components in Athena that require alternate width/height handling for images (such as media backgrounds), and to further support the Athena Framework's default behavior of having these styles be opt-in.
To avoid having to manually insert this class everywhere, you can install the Athena Shortcodes Plugin and configure it to automatically insert this class for you on new images added to post content (see "Enable TinyMCE tools and formatting" under Settings > Athena Shortcodes). There is alternatively a setting that strips width/height attributes on images (including images on existing posts/pages), which is enabled by default, though we recommend turning it off for performance reasons.
If you have any issues with using the Athena Shortcodes Plugin's options, please let us know by opening an issue on that project (https://github.com/UCF/Athena-Shortcodes-Plugin/issues/new/choose), but for now I'm going to close this as a wontfix.
Describe the bug After upgrading WordPress from the 5.4 branch to the 5.6 branch, images on several of our sites were stretched vertically.
Steps to Reproduce It happened by default.
Expected Behavior This is reportedly a known issue since the 5.5 update.
Possible Fix Adding the following CSS through the customizer fixed the issue for our sites: img {max-width:100%; height:auto}
Your environment:
Additional context This screen recording shows the before-and-after of the CSS fix. https://d.pr/v/DrcoGj