Streaming live at 10am (PST)

Is 200px the minimum height for a slider?


#1

I’m trying to add a slider of client logos to my site but I want the height of each slide to be 150 pixels. Oddly, it will not go below 200 pixels. Is this the minimum height for a slider?? I can change the slider itself to be 150 pixels, but not the individual slides. Help!


Show multiple Sliders in Slideshow & more
#2
  • add read-only link

#3

Here is the slider currently at a height of 200 pixels. When I change the slider height to 150 pixels, the individual slides do not change accordingly and the logos are no longer centered…

https://preview.webflow.com/preview/slider-test-b3f4a6?preview=2432fb13765b2774c2baaf2b357df94c


#4

Start from Zero - use “real images” - and that’s it. You work with empty divs and background-images this is more complex to work like this (endlees styles).

Also more semantic/valid to use images!
http://buildawesomewebsites.com/blog/html-img-tags-vs-css-background-images

With images you set:
height: 100px;
width: auto;

image

Do this

1/5: parent: Slider

Set the height to 100%

2/5: child: mask (No extra styles/class) !!

image

3/5: child child: slide (only set width) + text-align: center (to center horizintaly the image)

image

4/5: child child child: Real images

Add “image” to this slide (Remember also to add alts) - set height + width:auto; (and extra margin top/bottom for some space around)

Result:

5/5: Space right/left

Now beacuse you have diff proportions for the logos add some padding for the slide wrapper (or padding for the images) - option 1 (add padding to the slide wrapper)

option2 : add padding-top/bottom for the images

Finish

#logos-slider #webflow-slider-height


#5

Perfect! Thanks so much!