Hi Gang,
I finally noticed the issue. The img { max-width: 100% !important; ...} that is already there is encapsulated within a @media print {...}. So image is only being resized for printing. Hadn't noticed since the @media print {...} is over 80 lines of code and the Template Editor only shows a portion of these lines at a time.
So it does work if you add a img { max-width: 100% !important; ...} anywhere else in the file, but, outside any encapsulating constraining declaration.
Since bootstrap is used by this template, you can also get resizing by using <img alt="" class="img-responsive" src="MyImagePath" /> as suggested by LouisGac.
This probably also explains why rocketshops images were not being responsive on mobile until he did as suggested (see www.limesurvey.org/forum/design-issues/1...responsive-on-mobile ).
Thanks to LouisGac & tpartner for your suggestions.
I finally noticed the issue. The img { max-width: 100% !important; ...} that is already there is encapsulated within a @media print {...}. So image is only being resized for printing. Hadn't noticed since the @media print {...} is over 80 lines of code and the Template Editor only shows a portion of these lines at a time.
So it does work if you add a img { max-width: 100% !important; ...} anywhere else in the file, but, outside any encapsulating constraining declaration.
Since bootstrap is used by this template, you can also get resizing by using <img alt="" class="img-responsive" src="MyImagePath" /> as suggested by LouisGac.
This probably also explains why rocketshops images were not being responsive on mobile until he did as suggested (see www.limesurvey.org/forum/design-issues/1...responsive-on-mobile ).
Thanks to LouisGac & tpartner for your suggestions.