My active slide with my swiperjs slider is not in the center

I did some custom CSS classes to have images vertically aligned and also to have to in correct sizes on mobile screens.

Any Idea what I am doing wrong?

Here is the link: /

My active slide with my swiperjs slider is not in the center

I did some custom CSS classes to have images vertically aligned and also to have to in correct sizes on mobile screens.

Any Idea what I am doing wrong?

Here is the link: https://markrabadan./personal-work/

• javascript
• css
• swiper.js

1 Answer 1

1. padding and margin for images messes with sliderjs. Use spaceBetween: 30 option instead.
2. You can either have clipped images of same size(image-fit:cover) or variable size images(max-width:100%; max-height:100%).

https://codepen.io/saravanapriyanm/pen/mdLZqOJ?editors=1000