[XHTML-CSS] Hover su DIV

[Ruben Elmo]

Salve ragazzi, ho un menù del tipo:

<div id="MENU">
    <div class="SEZIONE"><div class="SFONDOSEZIONE">[img]immagini/sfondino.jpg[/img]</div>HOME</div>
    <div class="SEZIONE"><div class="SFONDOSEZIONE">[img]immagini/sfondino.jpg[/img]</div>CHI SONO</div>
    <div class="SEZIONE"><div class="SFONDOSEZIONE">[img]immagini/sfondino.jpg[/img]</div>FOTO</div>
</div> 

e un CSS:

.SEZIONE {
    color:#FFCCCC;
    font-size:12px;
    font-weight:bold;
    width: 150px;
    height: 30px;
    line-height: 30px;
    border-bottom-width: 1px;
    border-bottom-color:#FFCCCC;
    border-bottom-style:solid;
    text-align: left;
}

.SEZIONE:hover {
    background-color: #FFECEC;
    color: #FF9595;
}

.SFONDOSEZIONE {
    float: left;
    text-align: left;
    width: 30px;
} 

Cosa c'è di sbagliato?

In poche parole vorrei visualizzare l'effetto HOVER al passaggio del mouse su ogni singola "SEZIONE". Il tutto funziona su Firefox, ma su IE no!

[serialkiller]

Le pseudo classi su IE non hanno mai funzionato, ti conviene mettere un link grande come il tuo div dando la proprietà display:block al tag <a> che sarà contenuto nel div, in modo che si comporti come un elemento blocco e non inline