Image Responsive Issue

Question

Hi @Q2A Community,

When I insert/upload an image in any post, That image is showing perfectly in Desktop, but not in mobile. Here is the screenshot :

In Desktop :

In Mobile :

Please tell me how to solve this problem?

Comments

It seems like a CSS problem. You could try reaching out to the theme developer for an instant solution. Alternatively, you can set the element's "height" property to "auto." If you require further help, please share the page link so we can investigate the issue.

Answer 1

That seems to be Legacy theme. The theme already deals with images responsively:

.qa-q-view-content img, .qa-a-item-content img, .qa-c-item-content img {
    max-width: 100%;
    height: auto;
}

Although if you're using CKEditor, setting a height to pictures might override this.

There's 2 solutions for this,

Either you remove/don't set a height for pictures (screenshot here)
Or you force the code above to take place.

Go to Legacy > css > custom-styles.min and paste the following code at the bottom.

.qa-q-view-content img, .qa-a-item-content img, .qa-c-item-content img {
    height: auto !important;
}