Shawn Shawn - 1 year ago 135
HTML Question

Fixed size of Flexslider

I'm using Flexslider to pull product images of varying sizes from an API. I've been throwing them into Flexslider's

, but these varying image sizes don't play well. Flexslider nicely animates when images have different heights, but I want to have Flexslider have a fixed height and width to fit in my layout. I've tried putting the whole thing into a fixed-size
, but Flexslider ignores it completely and overflows into the rest of the layout. Is there some way to resize images to fit so that Flexslider doesn't resize?

Answer Source

Let's say you wanted a fixed size of 200px by 200px. Add these properties to the following selectors in the flexslider.css file and you should be good to go:

.flexslider {
    width: 200px;
    height: 200px;

.flexslider .slides img {
    width: 200px;
    height: 200px;

Hope this helps!

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download