不要与灯箱中的图像垂直对齐

Question

我想将图片置于灯箱图库中，垂直对齐：中间，但不能。我错在哪里？
HTML：

<div><img src="images/image1.png"></div> 

CSS：

div {
display: table-row;
/* or display: table; -> the result is the same for me */
height: 550px;
width: 100%;
text-align: center;
}
img {
display: table-cell;
max-height: 550px;
margin: 0 auto;
vertical-align: middle;
}

Answer 1

请尝试以下操作： Demo

div {
   display: table-cell;
    height: 550px;
    width: 100%;
    text-align: center;
    background: #0f0;
    line-height:100%;
    vertical-align: middle;
}
img {
display:inline-block;
max-width:500px;
}