[英]Center Image with Vertical Align
Images will not center with vertical align for me, as it seems they should. 对于我来说,图像不会像垂直对齐那样居中对齐,似乎应该如此。 I am coding for IE7 in quirks mode only (unfortunately). 我仅在怪癖模式下为IE7编码(不幸的是)。 My code is below. 我的代码如下。 Anyone know why this wouldn't vertically align 任何人都知道为什么这不会垂直对齐
<html>
<head>
</head>
<body>
<div style="height:500px; width 500px; line-height:500px; background-color:Green; vertical-align:middle;">
<img src="./images/load.gif" style="vertical-align:middle;"/>
</div>
</body>
</html>
If you want to vertically align your image within the div you should do the following: 如果要在div中垂直对齐图像,则应执行以下操作:
div {
position:relative;
height:500px;
width:500px;
}
div img {
position:absolute;
top:50%;
margin-top:-XXXpx; /* where XXX is half the height of the image */
}
您可以将图像设为背景图像,然后将背景居中,如下所示:
<div style="height:500px; width 500px; line-height:500px; background: green url('/images/load.gif') left center no-repeat ; "></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.