CSS 实现文字、图片垂直对齐(vertical-align)专题文章

垂直对齐在 Firefox 和 IE7 等最新浏览器中，已经不是什么难事，但是IE6下使用 DIV 布局，垂直对齐则依然是个非常令人头痛的问题；虽然 IE 7 已经越来越普及，但是 IE6 依然占了很大的份额，所以，还是让我们一起看看解决方法吧！

<style type="text/css">
/*     说明：IE 6 下 DIV 垂直居中对齐*/
 .fixVerticalCenterOuter {
	width:300px;
	height:200px;
	border:1px solid #ccc;
	text-align:center;
	display:table-cell;
	vertical-align:middle;
}  

/* for IE 6 */
* html .fixVerticalCenterAdd {
	width:0;
	height:100%;
	display:inline-block;
	vertical-align:middle;
}
* html .fixVerticalCenterInner {
	vertical-align:middle;
	display:inline-block;
}
</style>

 

<div class="fixVerticalCenterOuter">
 <span class="fixVerticalCenterAdd"></span>
 <span class="fixVerticalCenterInner">
  <a href="http://www.baidu.com/"><img src="http://www.baidu.com/img/baidu_logo.gif" /></a> 
    </span>
 </div>

 
源自：http://www.codebit.cn/pub/html/xhtml_css/tip/ie6_vertical_align/