css div图片上下左右居中

<style type="text/css">
div{border:1px solid #ccc;height:500pc;width:500px;text-align:center;margin:0 auto;background:#ccc;}
img{vertical-align:middle;}
div span{height:100%;width:0;oveflow:hidden;display:inline-block;vertical-align:middle;}
</style>
<div class="text">
<img src="1.png"/><span></span>
</div>