Slider size

Hi,
I have adjusted my homepage slider with this:
#slider ul.slides li img {
height: 400px;
}

The problem is now when I view the site on a mobile device or smaller window, the slider images do not scale, but they skew.

http://dev.ellenwalkerdesign.com/

Thanks!
Craig

 

Hello Craig,

Remove code you have shared above and
Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

#slider ul.slides li img {
height: auto!important;
}

It will adjust slider height according to image size.

Thanks & Regards
Nitesh Raghuwanshi

 

Hello!

Trying to do the same - have the image slider adjust to a larger picture - in my Cloriato theme. Added the code you listed... didn't change anything. Any other suggestions for the Cloriato theme?

Thanks!
Bill

 

Hello Bill,

Provide us your website url and issues in detail.

Thanks & Regards
Pramod

 

Hello;

Site is: http://bestclearwaterpetsitting.com/
I'm trying to have the slider pic show full size. I've already cropped it for proper width...

Thanks;
Bill

 

Hello Bill,

Paste the code given below in Custom CSS section

(Appearance -> Theme Options -> Styling Options -> Custom CSS) of your dashboard.

Code:

    .slide.slides_container {
    max-width: 950px;
    height: auto;
    }
    #slides .slide img
    {
    max-width: 950px;
    height: auto;
    }
 
 
@media only screen and (max-width: 480px) {
    #slides .slide {
    max-width: 292px;
    height: auto;
    }
    #slides .slide img {
    max-width: 292px;
    height: auto;
    } 
}
 
@media only screen and (max-width: 767px){
    #slides .slide {
    max-width: 470px;
    height: auto;
    }
    #slides .slide img {
    max-width: 470px;
    height: auto;
    } 
}

Thanks & Regards
Pramod

 

Perfect!

Huge thanks!
Bill