img在div中垂直方向居中，水平方向居中【转】

<style type="text/css">
   body,html{ height:100%; } 
   .box{ border:1px solid #ccc; height:80%; width:80%; text-align:center; margin:0 auto; } 
   .box img{ vertical-align:middle; } 
   .box span{ height:100%; width:0; overflow:hidden; display:inline-block; vertical-align:middle; } </style>

 

<div class="box"> 
     <img src="http://www.css-js.com/uc/data/avatar/000/00/25/60_avatar_middle.jpg"   width="120" height="109" /> <span></span> 

</div>

经测试ie6.7.8，ff，谷歌都么问题