包含已知大小的容器内部和中心内容

Question

我们有一个已知大小的容器。

在内部，我们的内容未知高度。

我们需要在水平和垂直居中时在容器中包含该内容。

内容由块组成：标签，图片，标签：

我设法完成了比容器更短的内容，但在其他情况下没有运气。 示例：http://jsbin.com/banava/4/edit?html,css,output

Answer 1

#content-wrapper {
    text-align: center;
    height: 200px;
    width: 200px;
    display: table;
}

#img-wrapper {
    width: 100%;    
    height: 100%;
    vertical-align: middle;   
    display: table-cell;
}

#img-wrapper label {
    display: block;  
    height: 25px;
    line-height: 25px;
}

#img-wrapper img { 
    max-height: 150px;
}

http://jsfiddle.net/L38jg9sr/15/