CSS定位DIV中的图片水平垂直居中问题，请各位高手分析下源码，并对源码的CSS稍作改动。

html-css023

CSS定位DIV中的图片水平垂直居中问题，请各位高手分析下源码，并对源码的CSS稍作改动。,第1张

祝您成功！

测试通过 IE6 IE7 火狐

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&quot>

<html xmlns="http://www.w3.org/1999/xhtml&quot>

<head>

<meta http-equiv="Content-Type" content="text/html charset=gb2312" />

<title>红色背景中的图片，水平、垂直居中定位问题！</title>

<style type="text/css">

<!--

body,td,th {

font-family: Verdana

font-size: 12px

}

.style_01 {

height: 172px

width: 230px

clear: both

overflow: hidden

background-color: #FF0000

}

.style_03 {

font-size: 12px

display: block

color: #000033

background-color: #CCFFCC

line-height: 1.5em

padding: 10px

margin-top: 3px

margin-right: 0px

margin-bottom: 0px

margin-left: 0px

}

#photo {

float: left

border: 1px solid #FF3300

display: block

width: 230px

margin: 3px

background-color: #99CC00

padding: 3px

text-align:center

}

.thumbImage {max-width: 230pxmax-height: 172px} /* for Firefox & IE7 */

* html .thumbImage { /* for IE6 */

width: expression(this.width > 230 && this.width > this.height ? 230 : auto)

height: expression(this.height > 172 ? 172 : auto)

}

-->

</style>

</head>

<body>

<div id="photo"><div class="style_01"><img src="http://hiphotos.baidu.com/447428776/pic/item/ced0d2d079e39e47a08bb78a.jpg&quot class="thumbImage" /></div><div class="style_03">拍摄时间：20080831123306 <br/>简要说明：略……<br/><h6 align="center"><a href="#" target="_blank">点击放大</a></h6></div></div>

<div id="photo"><div class="style_01"><img src="http://hiphotos.baidu.com/447428776/pic/item/235ea507164dccced43f7c92.jpg&quot class="thumbImage" /></div><div class="style_03">拍摄时间：20080831173424 <br/>简要说明：略……<br/><h6 align="center"><a href="#" target="_blank">点击放大</a></h6></div></div>

<div id="photo"><div class="style_01"><img src="http://hiphotos.baidu.com/447428776/pic/item/2bb010505125c712564e0090.jpg&quot class="thumbImage" /></div><div class="style_03">拍摄时间：20080831173653 <br/>简要说明：略……<br/><h6 align="center"><a href="#" target="_blank">点击放大</a></h6></div></div>

<div id="photo"><div class="style_01"><img src="http://hiphotos.baidu.com/447428776/pic/item/0987e19d7cf9554e6f068c83.jpg&quot class="thumbImage" /></div><div class="style_03">拍摄时间：20080831123306 <br/>简要说明：略……<br/><h6 align="center"><a href="#" target="_blank">点击放大</a></h6></div></div>

</body>

</html>