CMS Responsive Images

[ljubica]

Hi,

 

I add a class="img-responsive" for images, but it isn't work. 

I tried it on one page only, here http://www.pennasol.rs/content/7-pennasol  (you can see it in attachment).

 

If anyone can help I would appreciate it.

Edited April 6, 2017 by ljubica (see edit history)

[HanzCZ]

Hi,

I think you need to insert your image into div with responsive classes- something like this:

 

<div class="your responsive classes"><your image class="img-responsive"></div>

 

Image should be responsive according to the responsive width of his parent div.

 

 

[Angar]

Try adding css to your theme:

body#cms img { max-width: 100%;  height: auto; }

Edited March 30, 2017 by Angar (see edit history)

[ljubica]

I've finally found a solution...

in <img> tag instead of "width="1052" height="536" I put "width=100%".

And now everything is working well. Images are responsive.

 

 

I suppose everyone knows this is a temporary solution .. I hope that someone will find a better solution.

Edited April 6, 2017 by ljubica (see edit history)

[ljubica]

Try adding css to your theme:

body#cms img { max-width: 100%;  height: auto; }

 

Alredy have .cms-box img{max-width:100%} in global css.

.page-content.page-cms{background:#fff;padding:1.25rem;text-align:justify}.page-content.page-cms .cms-box img{max-width:100%}@media (max-width:991px){#block-cmsinfo{padding:1.25rem 1.875rem[spam-filter]

I noticed something else. Each time I insert an <img> it appears between <p> </ p>. Is this normal?

[sandrine12345]

On 4/5/2017 at 9:48 PM, ljubica said:

I've finally found a solution...

in <img> tag instead of "width="1052" height="536" I put "width=100%".

And now everything is working well. Images are responsive.

 

 

I suppose everyone knows this is a temporary solution .. I hope that someone will find a better solution.

Thank you so much, it works! 

[Alexander Firsov]

On 4/6/2017 at 2:48 AM, ljubica said:

I've finally found a solution...

in <img> tag instead of "width="1052" height="536" I put "width=100%".

And now everything is working well. Images are responsive.

 

 

I suppose everyone knows this is a temporary solution .. I hope that someone will find a better solution.

Yes, it does work like a charm! Thank you.