Waarom mislukken deze "span" binnen een "a" met IE7?

Ik heb deze code:

HTML (betekenis 4.0)

<div class="temperatura">
    
         Text1  

    
         Text2          
</div>

CSS (betekenis 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;
}

en dit is wat ik nodig heb:

  • de container temperatura is gekoppeld aan /link/;
  • elke a is 50% en de link heeft een opvulling (links of rechts);

op Firefox/Chrome/IE8/IE9 is er geen probleem. Op IE7, toenemend/deacresing (horizontaal) van het venster, kreeg de tweede link een nieuwe regel.

Waarom? En, hoe kan ik dit oplossen?

1
toegevoegd de auteur Sparky, de bron
Als u het kenmerk width: 50% van beide koppelingselementen verwijdert, worden ze dan weergegeven op dezelfde regel?
toegevoegd de auteur Martey, de bron

1 antwoord

Ik denk dat dit komt door je verdeling van 50%/50%. IE7 duwt de tweede link naar een nieuwe regel wanneer de pixeltelling van de div oneven is, maar behoudt de juiste positie wanneer deze even is. Het veranderen van beide breedtes naar 49% lost het probleem op.

1
toegevoegd