长为112px的td里面有一个块span,居中时引起的兼容问题

样式如下:

 .info_content table td.cols2{
 112px;
 }
.info_content table td.cols2 .spaToPay{
 display:block;
 68px;
 height:24px;
 line-height:24px;
 background:url('../images/back.png') no-repeat 0 -21px transparent;
 color:#fff;
 }

html代码如下:

 <td class="cols2"><span class="spaToPay">等待支付</span></td>

想染span块居中,如果不设置margin-left:20px.

在各个浏览器中的表现是

在firefox,google,opera等标准浏览器以及ie8,ie9中是

可在ie6,ie7中却已经居中了。

如图:

这个时候需要先针对标准浏览器设置margin-left:20px,然后再去算ie6,和ie7

可写成

.info_content table td.cols2 .spaToPay{
 display:block;
 68px;
 height:24px;
 margin-left:20px;
 _margin-left:0;//ie6专有
 *+margin-left:0;//ie7专有
 line-height:24px;
 background:url('../images/back.png') no-repeat 0 -21px transparent;
 color:#fff;
 }

这样设置后span块就真正居中了。

人生短短几十年,要在有限的生命里多做店有意义的事情。莫要让自己迎合别人的眼光活着。随心而为,听从心的声音。讨好自己,悠哉悠哉!
原文地址:https://www.cnblogs.com/jiaojiaome/p/3571689.html