Cornerstone Slider Max Height Setting & Loading

[iDigitalise]

Hi -

1. I am trying to set a maximum height for the cornerstone slider but can’t seem to make it work for some reason.

2. I’m also seeing issues with the slider having a delayed loading, so the full site loads and then the slider appears. I assume it could be the image size, however, one of the internal pages (About Me) has an optimised image and even that still has the same problem.

I found on one of the other forums here to add the below code into the CSS but that didn’t make it work.

.sliderx {
min-height: 204px;
}

Site URL in the secure note.

Thanks

[thai]

Hi @iDigitalise,

Please try adding this custom CSS under Theme Options > CSS:

li.x-slide {
    max-height: 450px !important;
}

Let us know how it goes!

[iDigitalise]

@thai

li.x-slide {
max-height: 450px !important;
}

That worked! Thanks!

Is there a way to adjust the image positioning individually, to Cover the space rather than crop the image.

So Slider 1 looks fine now however Slider 2 is completely cut off at the bottom.

Thx

[ruenel]

Hello @iDigitalise,

I have checked the “About Me” page and I can only find a slider with one slide.
Could you please point us to the url of the page in questioned?

Thanks.

[iDigitalise]

Yes, that page only has 1 slider, but the Home Page has 2 sliders.

It’s the second slider on the homepage, you can see has been cropped from the bottom rather than fit in

Thx

[ruenel]

Hello @iDigitalise,

Your images were not of the same dimension. I would recommend that you use images with the same widths and heights. And the image is also cut off because of this custom css:

li.x-slide {
    max-height: 450px !important;
}

You might want to update it and use this:

li.x-slide {
    max-height: 450px !important;
}

.home li.x-slide {
    max-height: 650px !important;
}

This code will increase the slide height up to 650 pixels and will be applied to the homepage only.

Feel free to adjust the maximum height if necessary.