[Resolvido] Border radius no ie

[MatheusSilva 0]

ola, adicionei o border radius em alguns elementos, funciona no chrome, funciona no mozilla, mas nao funciona no ie...

alguem sabe como posso fazer para funcionar?

 

html

<div id="menu">
<ul>
				<li><a href="index.php">Início</a></li>
				<li><a href="empresa.php">Empresa</a></li>
				<li><a href="servicos.php">Serviços</a></li>
				<li><a href="#">Contato</a>
		<ul>
			<li><a href="faleconosco.php">Fale Conosco</a></li>
			<li><a href="local.php">Localização</a></li>
		</ul>


	</li>
</ul>

</div>

 

css

#menu{
	top:22px;
	float:right;
	position:relative;
	background: url('imagens/fundomenu.png') repeat-x;
	width:362px;
		-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;

}
#menu ul{
	list-style: none;
	margin: 0;
	padding:0;

}
#menu ul li{
display: inline;
}
#menu ul li a{
float:left;
text-decoration: none;
color:#FFF;
font-family: Tahoma;
font-size: 20px;
padding: 10px 11px 10px 13px;
}
#menu ul li a:hover{
	background: url('imagens/menuhover.png') repeat-x;
				-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

#menu ul li ul{
display: none;
width:125px;
right:0;
top:44px;
position: absolute;
z-index: 9999999999999999;
background: #445151; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ0NTE1MSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM1ZDY3NjkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+');
background: -moz-linear-gradient(top,  #445151 0%, #5d6769 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#445151), color-stop(100%,#5d6769)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #445151 0%,#5d6769 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #445151 0%,#5d6769 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #445151 0%,#5d6769 100%); /* IE10+ */
background: linear-gradient(to bottom,  #445151 0%,#5d6769 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#445151', endColorstr='#5d6769',GradientType=0 ); /* IE6-8 */
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
behavior:url('border-radius.htc');


}
#menu ul li:hover ul{
display: block;
float:left;
}
#menu ul li ul li a{
font-size:16px;
width: 101px;
}
#menu ul li ul li a:hover{
background: url('imagens/menuhover.png');
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
padding-bottom: 10px;
behavior: url('PIE.htc');
}

 

quero colocar o border radius no: #menu ul li ul{}

 

 

espero que me deem uma luz, esse internet explorer ferra com tudo...

 

obrigado

[Marco Bruno 19]

Boa tarde, MatheusSilva.

 

O border-radius funciona a partir do IE9:

http://caniuse.com/#feat=border-radius

[MatheusSilva 0]

boa tarde marco, mas chegamos á um empasse entao, tenho aqui o ie9 e o mesmo nao funcionou.

O legal é que no chrome/firefox funcionou direito, mas nessa bagaça de ie nao funciona de jeito algum

 

tem algum cheat que possa fazer pra funcionar ?

[Nícolas Luís Huber 14]

Você tem certeza que está utilizando o IE9, pois a propriedade border-radius funciona perfeitamente no IE9. Verifique se a opção que aparece nesta imagem está desmarcada.

[MatheusSilva 0]

ta sim

 

esse em vermelho era pra tar com a borda

[MafnGamer 13]

Ae cara tente botar esses dois códigos de border radius.

//Border radius padrão
border-radius: 10px;

//esse não sei se funciona
-ms-border-radius: 10px;

Tenta ai e posta o resultado.

[MatheusSilva 0]

ja tinha isso ai, mas ok...pescebi que ele ta dando conflito com o gradient..

 

to usando este codigo

/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ0NTE1MSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM1ZDY3NjkiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+');
background: -moz-linear-gradient(top,  #445151 0%, #5d6769 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#445151), color-stop(100%,#5d6769)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #445151 0%,#5d6769 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #445151 0%,#5d6769 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #445151 0%,#5d6769 100%); /* IE10+ */
background: linear-gradient(to bottom,  #445151 0%,#5d6769 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#445151', endColorstr='#5d6769',GradientType=0 ); /* IE6-8 */

 

q raios pode ser?

 

EDIT---------

 

COnsegui pessoal, simplesmente adicionei no inicio da pagina:

 

<!--[if gte IE 9]>

<style type="text/css">

#menu ul li ul {

filter: none;

}

</style>

<![endif]-->