Cantos e bordas arredondados com CSS3
CSS - Aplicar cantos arredondados em div's utilizando CSS3Informação: Essa função CSS3 funciona perfeitamente nos navegadores Internet Explorer 9, Google Chrome, Mozila Firefox e Safari.
Cada um desses navegadores precisará de um prefixo para que funcione, lembrando que esse prefixo será temporário até que o W3C valide os comandos CSS3.
Lista com prefixo de cada navegador
Mozilla Firefox: -moz-
Google Chrome e Safari: -webkit-
Opera: -o-
Internet Explorer: -ms-
Vamos ao exemplo de BORDER RADIUS
Obs: Irei mensionar apenas os pefixos dos navegadores mais usados, é importante colocar o comando também sem os prefixos como no exemplo, pois assim que os mesmos forem validados seu código ainda funcionará.
.teste {
background: #333;
width: 450px;
margin: auto;
padding: 10px;
text-align: center;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
}
Coloque as informações de border-radius na no ID ou class da div que desejar que fique com as bordas arredondadas:
Veja o Resultado:
Projetos e Tecnologia