Vertically center text in Bootstrap carousel

Question

I have trouble creating a carousel in Bootstrap 4 with text centered both horizontally and vertically.

I have created the bootply with a carousel, but the text is ju

Answer 1

You can use display: table; and display: table-cell; display along with vertical-align: middle;

.carousel-item {
    display: table;
    text-align: center;
}

.carousel-item h1 {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
}

The key here is vertical-align: middle; which works only if a div is a table.

Regarding the horizontal alignment, the text-align: center; goes to .carousel-item. I updated my code.