Dynamic Resizing

Hi @cregy

By putting a boxed slider into a narrow container, that container will always limit the width of your slider, so your slider won’t be able to go wider than that and nor the images inside the slider.

If you want the images to appear without being cropped then what you should rather do is using the “Fit” or “Blur fit” fill mode:

• https://smartslider.helpscoutdocs.com/article/1809-slider-settings-slides#slide-background-image-fill

that way your images could fit into the slider. If the aspect ratio of your images and the slider differs, then a gap would occur around the images. With the blur fit fill mode, there would be an enlarged and blurred version of the image behind.

Best regards,
Laszlo.

Thanks for the reply @laszloszalvak that almost answered my query. I have put the slider in a box but what if I want that box to now be 900px in width but keep the height in relation to this so the picture scale correctly?

Thanks

Rich

Hi @cregy!

Your slider’s width can only be based on its container, so if you want to have a 900px wide slider, that container has to be 900px wide too. You could use this CSS code:

div.site-container .header-widget-area{
   max-width:900px;
}

to increase your theme’s header to be 900px wide. You could go to our slider’s Developer tab:
https://smartslider.helpscoutdocs.com/article/1806-slider-settings-developer
and insert the code into the CSS field.

Then if you want your ‘Slider size’ ratio to be used on any screen:
https://smartslider.helpscoutdocs.com/article/2033-what-affects-slider-size#slider-size
you should make sure, that the “Limit slide width” is being turned off:
https://smartslider.helpscoutdocs.com/article/2033-what-affects-slider-size#limit-slide-width
which creates a maximum height for your slider. And at the Layout:
https://smartslider.helpscoutdocs.com/article/2033-what-affects-slider-size#boxed
don’t use “Min height” either, as that would distort the ratio too.

Brilliant and thanks for all the help and an amazing plugin.

rich