CSS中一个IE和CHROME兼容的问题

1,问题描述

需求：在网站上添加相关验证图标，需要横排居中格式

2，分析

本来是个小case，虽然本人不是做前台技术的，但是多多少少还是用过DIV、CSS的，所以，一看用<ul>格式吧。

经过无数次调整，效果出来了。

代码如下：

<div style="width:100%; margin-bottom:10px;margin:0 auto;vertical-align:middle;margin-top:20px">
<ul>
<li style="display:inline-block; vertical-align:middle;"><a href="" target=_blank><img src="../Default/images/315new.GIF"/></a></li>
<li style="display:inline-block;vertical-align:middle;"><a href="" target=_blank><img src="../Default/images/bluelogo.gif"/></a></li>      
<li style="vertical-align:middle;display:inline-block;"><a href="" target=_blank><img src="../Default/images/Credit.jpg"/></a></li>
</ul>
</div>

相当简单，之所以没有把CSS写成文件，是由于这个网站构架较大，网页包含异常多，所以格式文件不太好找，而且本来是一个小东西不去折腾了。

当会美工，呵呵，打开chromium,yeah

但是，一会，同事说怎么是竖排的？我一看在IE下果然如此，但是在火狐，chrome下全部正常，话说最标准格式应该是chrome浏览器了，但是谁叫微软是老大呢，蛋疼。

3，分析一下，应该是<ul><li>格式支持不太兼容，换成简单的<span>

代码：

<div style="width:100%; margin-bottom:10px;margin:0 auto;vertical-aspangn:middle;margin-top:20px">
<span style="display:inspanne-block; vertical-aspangn:middle;"><a href="" target=_blank><img src="../Default/images/315new.GIF"/></a></span>
<span style="display:inspanne-block;vertical-aspangn:middle;"><a href="" target=_blank><img src=".../Default/images/bluelogo.gif"/></a></span>      
<span style="vertical-aspangn:middle;display:inspanne-block;"><a href="" target=_blank><img src=".../Default/images/Credit.jpg"/></a></span>
</div>

问题解决，简单事情还是简单好点，其实对CSS支持最好的还是chrome，浏览速度也很快