I am currently facing an issue with the carousel in the latest version of Bootstrap (4.5). I have set up a multiple item carousel by creating a grid inside it, where each item looks like this:
<div class="carousel-item active">
<img class="col-6" src="images/IMAGE 1" alt="">
<img class="col-6" src="images/IMAGE 2" alt="">
</div>
To make it compatible with Bootstrap 4.5, I had to add the following CSS:
.carousel-item {
margin-right: 0;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
Despite this adjustment, the animation is still not working correctly. For a better understanding, you can watch a video demonstration through this link:
If anyone knows how to resolve this issue, please provide some guidance. I believe it might be something obvious, but as a beginner in HTML/CSS, I am still learning.
You can view the page in question by visiting this link: