Whole slider size goes wild when different image sizes comes into play

[ModithaAk]

Describe the bug when there are smaller pictures the whole slider goes wild with shrinking and growing

Image Gallery Version latest

To Reproduce Steps to reproduce the behavior:

1. try different image sizes instead of the same image size

Expected behavior some way to keep the size of the slider consistent

Screenshots

[xiaolin]

I'm not sure I understand the issue here. Can you clip a video?

[cajakil]

I think @ModithaAk is saying that the <ImageGallery> resizes when image size varies, and they don't want this to happen.

[xiaolin]

Ah, the gallery does not take into account different image sizes and generally, you should have consistent image height & width for a better user experience. If you'd like to have various sizes Id leave it up to you to modify the CSS to support your use case.

[jmaister]

For the future visitors of this thread (like me), I solved it with some CSS:

Creating a container with the image class:

const ImageContainer = styled.div`
    .image-gallery-image {
        width: 100%;
        height: 600px;
    }
`;

Then wrapping the ImageGallery:

                <ImageContainer>
                    <ImageGallery
                        items={images}
                        thumbnailPosition="bottom"
                        infinite={true}
                        showBullets={true}
                        showNav={true}
                        showIndex={true}
                        additionalClass="simple-border"
                        />
                </ImageContainer>