Hi all, I have a problem with rounded edges in a navigation menu for Hover and Active event, my CSS code is as follows:

#menu li a{
background:#2BB8D6;
display:block;
text-align:center;
text-decoration:none;
color:#fff;
line-height:30px;
padding:0px 25px;
margin-right:20px;
-Webkit-border-radius:4px;
-Moz-border-radius:4px;
border-radius: 4px;
behavior:url(PIE.htc);
position:relative;
}

#menu li a:hover{
color:#FFFFFF!important;
background-color:#1267BC!important;
display: block;
-Webkit-border-radius:4px;
-Moz-border-radius:4px;
border-radius: 4px;
behavior:url(PIE.htc);
position:relative;
}

#menu li.active a{
color:#FFFFFF!important;
background-color:#1267BC!important;
display: block;
-Webkit-border-radius:4px;
-Moz-border-radius:4px;
border-radius: 4px;
behavior:url(PIE.htc);
position: relative;
}

It works perfect in Chrome and Mozilla but not in Internet Explorer, Internet Explorer only works in idle status with rounded edges but when mouse over the corners become straight and the state "active" also remains with square corners.

If you import the menu into something I am applying in Joomla.

Thank you very much everyone for your answers, soon.

(Original text in Spanish translated by http://translate.google.com.co)

--------
Spanish

Hola a todos, tengo un problema con los bordes redondeados en un menú de navegación para el evento de Hover y Active, mi codigo CSS es el siguiente:

#menu li a{
background:#2BB8D6;
display:block;
text-align:center;
text-decoration:none;
color:#fff;
line-height:30px;
padding:0px 25px;
margin-right:20px;
-Webkit-border-radius:4px;
-Moz-border-radius:4px;
border-radius: 4px;
behavior:url(PIE.htc);
position:relative;
}

#menu li a:hover{
color:#FFFFFF!important;
background-color:#1267BC!important;
display: block;
-Webkit-border-radius:4px;
-Moz-border-radius:4px;
border-radius: 4px;
behavior:url(PIE.htc);
position:relative;
}

#menu li.active a{
color:#FFFFFF!important;
background-color:#1267BC!important;
display: block;
-Webkit-border-radius:4px;
-Moz-border-radius:4px;
border-radius: 4px;
behavior:url(PIE.htc);
position: relative;
}

Funciona perfecto en Chrome y Mozilla pero no en internet explorer, en internet explorer solo funciona el estado de reposo con bordes redondeados pero al pasar el mouse por encima las esquinas se vuelven rectas y el estado "active" también permanece con esquinas rectas.

Si importa en algo el menu lo estoy aplicando en Joomla.

Muchas gracias a todos por sus respuestas, hasta pronto.

Remove !important from the background properties.

THANKS Jason works perfect.