asp.net – IE6 vs IE8,按钮vs超链接,CSS渲染问题

形成

<div class="Center_300 ">
 <button id="KeaneDelegate" runat="server" class="button_red2" causesvalidation="false"><span>Keane's delegate view</span></button> 
<br />
<br />
<a class="button_red2"> <span>Keane's delegate view</span></a> 
</div>

CSS

.button_red2 
{
background:url('../../images/button_red_left.gif') no-repeat left top; 
display:inline;  
float:left; 
font-size:12px;  
font-weight:bold; 
line-height:16px; 
height:21px; 
padding-left:9px; 
text-decoration:none;
border-style:none; 
color:White;
 }
.button_red2  span
{   background:transparent url('../../images/button_red.gif') no-repeat top right; 
padding:3px 10px 2px 0px;
border-style:none;
display:block;
}

.Center_300 { width:300px; margin:0 auto }

在IE8的兼容模式(IE6)中查看时,按钮正确渲染,但我的文本左侧和右侧有“空白”空格.
超链接正确呈现

当我切换回本机IE8模式时,按钮正确呈现,如同超链接一样长,但在滑动门中有轻微的错位,右侧部分似乎被分流1个像素

如果我然后删除块对齐并调整填充,它渲染完美(但不再是超链接)

.button_red2  span
{   background:transparent url('../../images/button_red.gif') no-repeat top right; 
    padding:3px 10px 3px 0px;
    border-style:none;
 }

但是将其切换回IE6模式会让它变得更加丑陋

我正在尝试使用按钮,而不是我的表单的超链接,但从我交付的CSS样式,只有超链接在各种IE版本之间完美呈现.

为什么按钮上的IE6渲染中有额外的空间？回到IE8模式时,为什么它会出现像素格式,如何排序呢？还是不可解决？

在滑动门的2个GIF下面.

tnxs

克里兹