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,浏览速度也很快

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值