Bootstrap旋转木马：向上滑动垂直居中的文字

Question

我将旋转木马项目中的文字居中使用display:table-cell和vertical-align: middle。它工作正常，但当幻灯片更改其中的文本显示在顶部的第一个，然后居中。

这里是我的代码 - JSFiddle

如何继续进行？

Answer 1

您没有设置任何边距。我添加了一些项目，它似乎工作。

https://jsfiddle.net/a76d2q7u/3/

body{ 
    background-color: grey; 
} 
.carousel{ 
    height:200px; 
    display:table; 
    width:100%; 
} 
.carousel-inner{ 
    display:table-cell; 
    vertical-align: middle; 
} 

.item{ 
    text-align: center; 
    font-size: 30px; 
    margin: 17% 0px; 
}