In this post, we will see how to resolve How can I vertically align a div within bootstrap 5 carousel on all screen sizes?
Question:I would like the text div inside a bootstrap 5 carousel to be vertically aligned (centered) on large and small (mobile) screens.
The site is here…
Here is the html for the div. The div that needs to be centered is has the css class
I tried removing position absolute from #hero .carousel-container while adding aligns-items-center to the parent div (carousel-item) but it does not seem to help
Best Answer:There are many way using which you can vertically center that div but the way css you have use and i assume that you have knowledge of css positioning property so just change your css with given below.
If you have better answer, please add a comment about this, thank you!