Hello all,
I have a question about sliders and the images you use, if I add a slider with an image how would I get the image to resize when the slider resizes?
At the moment I have a slider, but when I changed through the devicess the image gets put out of view, is there a way to do this? or would I need to create a new image for every device?
https://preview.webflow.com/preview/wrapituk?preview=3d22231776e611ec171fbf94aff4c9cd
Best regards,
Matt
Hi @Matty,
Since pictures has some ratio, in this situation you should decide:
or picture will keep slider height on different devices for fit the slider height, but then the car on the picture will not fit the screen,
or pic will change it width to fit device width but then slider height should be change too (because of image ratio).
Cheers,
Anna
Hello @sabanna
Thanks for the reply, I’m afraid you completely lost me. What I’m after is the in the picture to be shown across all devices but it gets pushed out.
If I changed the image to 100% shouldnt it scale the image to fit?
Best regards,
Matt
Height 100% or width 100%? Yes,it will. just do not forget, that picture is background image in the slide not actually img element. and change it width or height you should inside the slide background settings.
I didn’t lost your idea. Lets say we just not sure we correct understand each other 
Hi @Matty, currently as things are styled, when the viewport is smaller than the image, the image will get cropped, so I suggest to update your bg image styling to use the Background Cover option and center positioning for the background image.
See my example video:
I hope this helps, let me know if you have any questions.
Thank you! that has helped allot, is there a way to reduce the black background? for e,g on mobile view
Once again, thank you!
Hi @Matty, you can try to adjust the slider height, on the slider class…try that and see if it helps.
You can also crop the original image to a smaller overall image width, so that less black space is shown on the image on left and right of the car, which will help with styling and layout of the image on smaller devices while keeping the actual car image clearly visible.
Cheers,
Dave
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.