Make images responsive


Author Message
Gary

Posted: 3/4/2014
Quote message 

What is the best way to make images responsive?
 
Eileen
Artisteer Team

Posted: 3/5/2014
Quote message 

Hello Gary,
there's number of posts and questions which arose from time to time concerning the images in responsive mode. However I need to say that situations are different and depend on where the image is used: header image, slideshow, image inside content, etc.
Also the solution is often specific for certain site.

For example if you're using the header background image usually it is enough to use "Contain" option for it under Header ribbon > Background Options > Responsive Background > CSS Size.

So please describe your specific issue here or contact Artisteer support about it.
 
WebsiteGuru

Posted: 4/9/2014
Quote message 

Quote WebsiteGuru:

No its not difficult ...

Here is the fix ....
For images to center on all devices copy this code and follow my the instruction.


CODE TO INSERT:

img, img.scale-with-grid
{
outline: 0;
max-width: 100%;
height: auto;
margin: 0 auto;

}



INSTRUCTIONS:
1. Go to File --> Export --> Options --- CSS Options
2. Insert this code and DO NOT remove any other code you see in there if that code with the template you chose ..

----

Note that Circular images do not follow this rule.
This for only images that are not circular ...


Send me a screenshot if you are having any issues
 
DR

Posted: 5/14/2014
Quote message 

The techniques work for the images in the post but not in the modules.
In this site http://www.drinternational.biz images in the modules do not scale on Iphone
 
Eileen
Artisteer Team

Posted: 5/15/2014
Quote message 

Hello Guys,
please check this article http://www.artisteer.com/?p=responsive_header it describes how to customize the header in responsive mode, it should be helpful
 
michelle

Posted: 11/24/2014
Quote message 

i am also experiencing problems styling the images that are in diiferent modules and configuring them for responsive view.
any tips on how to do this and maybe how to style the content within modules will be more than appreciated.
any guide lines to follow.
Created template in artisteer 4, works well in responsive except for all the content in the modules i added

thanks again
 
Anna

Posted: 12/1/2014
Quote message 

Not sure if this is the right solution, but I had issues with images I inserted in the modules or so called cells and then I changed the image size and width to 100% in html and now it scales with the window and stays on the right position.

Mind this is a suggestion from a total noob in these matters and found by accident.
 
compuserv

Posted: 4/3/2015
Quote message 

I have insert the code

img, img.scale-with-grid
{
outline: 0;
max-width: 100%;
height: auto;
margin: 0 auto;

}

in:
File --> Export --> Options --- CSS Options

but the header is not responsive again

site: www.mymommy.it

 
Eileen
Artisteer Team

Posted: 4/3/2015
Quote message 

@compuserv

you may enhance the CSS in template.css and add dimensions for responsive imagesL

.responsive img {
height: auto;
width: 100%;
}

It should help.
 
kelvin

Posted: 6/22/2015
Quote message 

Hello compuserv
How did you make your website responsive. Need some help here.
 
Marko

Posted: 3/14/2016
Quote message 

Quote Eileen:

Braucht die Lösung des Problemes jemand in Deutsch? Kurze PN !!

:-)
 
hans

Posted: 5/25/2016
Quote message 

Quote Marko:

Quote Eileen:

Braucht die Lösung des Problemes jemand in Deutsch? Kurze PN !!

:-)


 
Hakan Galip

Posted: 12/2/2016
Quote message 

Quote hans:

Quote Marko:

Quote Eileen:

Braucht die Lösung des Problemes jemand in Deutsch? Kurze PN !!

:-)




ich benötige die Lösung in deutsch !