ePublishing Knowledge BaseContinuumCommon Responsive Design QuestionsWhy do my images look squished in the body of my article, blog posts, landing page or other content?

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 on the resize image that appears in the tool bar that pops up.

When the Image Properties box opens, you'll likely see that the width and height are entered.

To fix the size, delete the height and set the width at its original or preferred size. The height will adjust automatically. Click Update. Then Click Save Changes in the top right corner.

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.