This is working perfectly except I get too much “mask” in tablet and phone views.
https://preview.webflow.com/preview/shit-2?preview=0c04c7126734a41cc3528e40709fa308
Can anyone tell me the STEPS to remove this low hanging mask without my whole site blowing up?
Hi @hutchman61, It looks like your slider’s height is set. Try using auto when designing for a responsive slider (see attachment)
Also, this demo may be helpful for general responsive slider style settings:
Demo: https://webflow.com/website/Demo-Kit
Page Title: Responsive Slider
I hope this helps! 
PS: please include screenshots showing design issues so we can help you faster 
@thewonglv’s steps work – Make sure you don’t have heights set on the slider itself, the mask, and the slides in it (you do have heights currently on all three, randomly across various viewports), also, take the 5px padding off of the bottom of the slider that you have set on the portrait phone viewport.
that should fix it
Great, that worked. NOW how do I had a third slide without destroying the whole slider?
https://preview.webflow.com/preview/shit-2?preview=0c04c7126734a41cc3528e40709fa308
Glad it worked.
That preview link doesn’t work fyi
To add a new blank slide select the slider, go to the settings tab, click new slide (as shown below)
To duplicate an existing slide, select the one you want to duplicate from the navigator tab and press the duplicate button at the bottom of the screen (as shown below)
You can also further orientate yourself with sliders by checking out the sliders documentation here
Hope this helps mate!
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
