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

Question

我想使用 vertical-align: middle 将 lightbox gallery 中的图像居中，但不能。我哪里做错了？
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;
}