# Responsive images in Presentation Slider

**URL:** <https://forum.pinegrow.com/t/responsive-images-in-presentation-slider/4687>\
**Category:** Pinegrow Interactions Add-on\
**Created:** [November 18, 2020, 11:16am UTC](https://forum.pinegrow.com/t/responsive-images-in-presentation-slider/4687 "2020-11-18T11:16:16Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![AllMediaLab](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/allmedialab/32/2079_2.png) [@AllMediaLab](https://forum.pinegrow.com/u/AllMediaLab)\
**Post date:** [November 18, 2020, 11:16am UTC](https://forum.pinegrow.com/t/responsive-images-in-presentation-slider/4687/1 "2020-11-18T11:16:16Z")

</div>

Hi,

Have been trying Interactions 2 out and all looks very nice. I noticed that when a Presentation Slider is created you use links from Unsplash and `object-fit: cover;` I’m trying to implement Farkas Lazy Sizes in the slider and it works (it shows my images), but the problem is that I need: `width:100% height:auto` for the images and the slider should adapt to that. Is this possible to change in the CSS from within Pinegrow? Or do I need to rewrite the original CSS for this. I’m talking about the most common way images are added to any slider I use also without Lazy Sizes.

In short I’m looking for the “auto height” function of the slider.

Regards & Thanks,  
David

This is a example of the royal slider that I created to show you what I try to explain:  
(On Chrome you have to use the responsive mode in the dev tools to see the effect! In Firefox it works out of the box!)

[https://www.yourweblab.nl/royal](https://www.yourweblab.nl/royal)

 ![pine-slider-wide](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/4/4955e3b656f77e5152f68e8679f965f128b3bf11.jpeg)

 ![pine-slider-portrait](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/5/57b33e76eb7c3fac878d6dbd0ec33310277b5fb0.png)
