Why do my images look squished in the body of my article, blog posts, landing page or other content?
When you add an image as-is into the body of your content using the Media Manager without resizing it, the image will never appear "squished." Default style rules allow those images to scale or resize depending on the device you are using, including a desktop computer, laptop, tablet or smartphone.
However, when you need to manually resize due to the source image's being too large, take the following steps to make sure that the image will scale properly no matter which device your reader is using.
If your photo is "squished," like the below - where the height and width are not proportional - open your article, and click on the image in the WYSIWYG editor.
Click the image, and then click the Image icon in the WYSIWYG.
To fix the size, delete the height and set the width at its original or preferred size. The height will adjust automatically.
While in the Image Properties box, make any alternative text updates, or border and space/padding adjustments to your image if desired.
Click the Advanced tab.
Click Commit Changes and Save your article changes.
Your photo should no longer appear squished when you open your article on a phone or tablet.
Note: You must follow these rules because the inline styles that are created using the height attribute in an image form trump the external CSS file. This is based on the common rules for how CSS works.