不要与灯箱中的图像垂直对齐
Don't work vertical align with image in lightbox
我想使用 vertical-align: middle 将灯箱画廊中的图像居中,但不能。我哪里做错了?
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;
}
这样试试: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;
}
我想使用 vertical-align: middle 将灯箱画廊中的图像居中,但不能。我哪里做错了?
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;
}
这样试试: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;
}