How to vertically center a Bootstrap carousel-caption?

You can use the translateY function of the CSS property transform to vertically align elements. Browser support is quite decent, including IE9. Therefore just add the following to your .carousel-caption CSS.

top: 50%;
transform: translateY(-50%);

Now you need to get rid of the extra bottom space, added by the default bootstrap CSS. Add the following as well to your .carousel-caption CSS.

bottom: initial;

And last but not least give the parent element, in this case .item, the following CSS to prevent blurry elements when it's placed on half a pixel.

-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;

Working Example