Images get stretched in responsive and mobile mode... MAJOR PROBLEM...

My website is http://clientlync.com/

Some (not all) images gets distorted when the browser is resized (smaller) and in the mobile view...

Regular view (looks normal)...



Browser re-sized view...




Mobile view...

http://clientlync.com/how-to-stay-healthy-when-you-work-from-home/

I browsed this entire forum and did not find a fix for this. The following and similar codes (listed in this forum) did not work:

.fullwidth img {
width: 80%;
}

I changed the 80% to various numbers but it did not help.

Please help me fix this MAJOR problem!

 

Hello,

Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

 .content-bar .post.single .post_content.single img {
width: 100%;
height: 100%;
}

Thanks & Regards
Gourav Shrivastava

 

The code you provided above fixed the issue however it created the following problem:

I'm working on a post (draft - not published) and the images in the post (in all sized screens - mobile and desktop) displays too big. See below...

Normal view before the CSS code was added:


Problem view after CSS code was added:


Normal view before the CSS code was added:

Problem view after CSS code was added:

Please help. I want to publish and promote this post soon.

 

Hello,

Remove previous css code and make changes as shown in the image.
Go to the Appearance > Editor > style.css




Thanks & Regards
Nitesh Raghuwanshi

 

Perfect. Thanks.