html - 为什么 "span"中的这些 "a"使用 IE7 失败？

Question

我有this代码:

HTML(意思是 4.0)

<div class="temperatura">
    <a href="/link/" class="temperatura_localita">
        <span style="padding-left:12px;">
            Text1
        </span>
    </a>
    
    <a href="/link/" class="temperatura_dettagli">
        <span style="padding-right:70px;">            
            Text2
        </span>
    </a>        
</div>

CSS(意思是2)

.temperatura
{
    height:34px;
    position:relative;
    background-color:#FF0000;
}

.temperatura_localita
{
    width:50%;
    height:34px;
    line-height:34px;
    float:left;
}

.temperatura_dettagli
{
    width:50%;
    height:34px;
    line-height:34px;
    float:left;
    text-align:right;
}

这就是我需要的:

• 容器temperatura链接到/link/；
• 每个 a 都是 50%，并且链接有一个填充(左或右)；

在 Firefox/Chrome/IE8/IE9 上没有问题。在 IE7 上，增加/减少(水平)窗口，第二个链接换行。

为什么？而且，我该如何解决这个问题？

Answer 1

我认为这是因为你的 50%/50% 划分。当 div 的像素数为奇数时，IE7 将第二个链接推到新行，但在它为偶数时保持正确的位置。将两个宽度都更改为 49% 即可解决问题。