Curvas con CSS3 Internet Explorer 8

Hola que tal, hace medio dia publique otro tema para ver si me podian ayudar, esto es algo asi como una continuacion ya que el error anterior es por parte de mi servidor.

Ahora lo que quiero es que esta pagina se vea igual en ambos navegadores (firefox, safari, IE8),

Código HTML :

http://soydavidsuarez.com/pruebacurvas/

podran notar que en la pagina principal se ve bien, todas las esquinitas correctamente redondeadas, pero ahi no radica mi problema, podrian darle clic en el mundito donde dice Change Country, si lo abren en FF se vera correctamente con fondo negro transparente, letras y bordes blancos... como en la imagen de abajo:



Pero en IE se ve completamente mal, hasta el texto pierde su formato...



Alguna idea de que podria estar saliendo mal??

Bueno, con un pequeño hack he podido hacer que respete las propiedades del div

Código HTML :

<!--[if IE]>
<style type="text/css" media="screen">
#menu ul li {float: left; width: 100%;}

#aviso{color:#FFF; padding: 2px 2px 2px 2px;}
#aviso a:link {color:#FFF; text-decoration:none;} 
#aviso a:visited {color:#CCC; text-decoration:none;} 
#aviso a:hover {color:#FFF; text-decoration:underline;} 
#aviso a:active {color:#F00;} 

</style>
<![endif]-->

Ahora se ve asi:


Para que se viera el borde blanco del rectangulo elimine las lineas:

Código HTML :

border-radius: 15px;
behavior: url(border-radius.htc);

Estas estan dentro del CSS de shadowbox, las intente poner tambien en el hack, pero igual siguio sin tomarlas encuenta para hacer las esquinas redondas, si alguien me pudiera asistir con eso seria magnifico.

Solo es una idea, pero quizas te ayuda.
Hacelo con una imagen .png con la transparencia y borde que buscas.
La pones como fondo del div y listo.
El unico navegador con problema seria IE 6, pero incluso si queres que se vea igual en "ese navegador" hay un javascript llamado pngfix que soluciona el problema.

Saludos.

Lo intente, de hecho habia publicado la respuesta aqui, pero la borre, sin embargo no es la solucion, porque en si el problema se presenta solo con shadowbox 3.0.3, la solucion con los divs requiere modificar el codigo js en shadowbox y el css, mira posteo el codigo de nuevo a ver si lo puedes hacer funcionar (o alguien, quien sea):

en skin.js reemplazan:

Código HTML :

     '<div id="shadowbox_container">' +
                    '<div id="shadowbox_overlay"></div>' +
                    '<div id="shadowbox">' +
                                                '<table width="100%" border="0" cellspacing="0" cellpadding="0">' +
  '<tr>' +
    '<td id="sb-tl"></td>' +
    '<td id="sb-tc"></td>' +
    '<td id="sb-tr"></td>' +
  '</tr>' +
  '<tr>' +
    '<td id="sb-cl"></td>' +
    '<td id="sb-cc">' +
                        '<div id="shadowbox_title">' +
                            '<div id="shadowbox_title_inner"></div>' +
                        '</div>' +
                        '<div id="shadowbox_body">' +
                            '<div id="shadowbox_body_inner"></div>' +
                            '<div id="shadowbox_loading">' +
                                '<div id="shadowbox_loading_indicator"></div>' +
                                '{cancel}' +
                            '</div>' +
                        '</div>' +
                                                '</td>' +
    '<td id="sb-cr"></td>' +
  '</tr>' +
  '<tr>' +
    '<td id="sb-bl"></td>' +
    '<td id="sb-bc"></td>' +
    '<td id="sb-br"></td>' +
  '</tr>' +
                                                '</table>' +
                        '<div id="shadowbox_info">' +
                            '<div id="shadowbox_info_inner">' +
                                '<div id="shadowbox_counter"></div>' +
                                '<div id="shadowbox_nav">' +
                                    'Close' +
                                    '' +
                                    '' +
                                    '' +
                                    '' +
                                '</div>' +
                                '<div class="shadowbox_clear"></div>' +
                            '</div>' +
                        '</div>' +
                    '</div>' +
                '</div>',

//y en skin.css agregan:

Código HTML :

#sb-tl {
background: url(rnd_white.png) 0 0 no-repeat;
height: 20px;
width: 20px;
}
#sb-tc {
background: url(rnd_white.png) 0 -40px repeat-x;
height: 20px;
padding-top: 2px;
}
#sb-tr {
background: url(rnd_white.png) -20px 0 no-repeat;
height: 20px;
width: 20px;
}
#sb-cl {
background: url(rnd_white.png) 0 -80px repeat-y;
width: 20px;
}
#sb-cc {
background-color: #FFFFFF;
}
#sb-cr {
background: url(rnd_white.png) -20px -80px repeat-y;
width: 20px;
}
#sb-bl {
background: url(rnd_white.png) 0 -20px no-repeat;
height: 20px;
width: 20px;
}
#sb-bc {
background: url(rnd_white.png) 0 -60px repeat-x;
height: 20px;
}
#sb-br {
background: url(rnd_white.png) -20px -20px no-repeat;
height: 20px;
width: 20px;
}

Y agreguen esta imagen http://shadowbox-js.1309102.n2.nabble.com/file/n1311078/rnd_white.png

Pero no lo he podido hacer funcionar en la version 3.0.3 de shadowbox.

Nota: la solucion la encontre en google en esta pagina [url] http://shadowbox-js.com/forum.html#nabble-td1311077[/url]