(Resolvido) Cantos arredondados

[Rafael Laurindo]

Pessoal, os navegadores já estão suportando CSS 3? Posso usar divs com cantos arredondados, e de forma simples?

Editado Outubro 3, 2010 por Rafael Laurindo

[Toze]

Chrome, Safari, Firefox, e IE8 já suportam. já o IE7 não suporta.

O que costumo fazer é "graceful degradation" um técnica que na verdade consiste em utilizar cantos arredondados sombras etc sempre que necessário, e nos navegadores que não reconhecem as bordas ficam quadradas, de modo de que não se perca funcionalizade apenas aparência.

Boa sorte.

Editado Setembro 27, 2010 por Toze

[Rafael Laurindo]

Mas é isso mesmo que quero, e não é para funcionar no IE, só nos que são complacentes com padrões. E como fazer isso, nas CSS 3? Pode postar um exemplo?

[vini_loock]

Para cantos arredondados:

border-radius: 5px;//propriedade "correta"
-moz-border-radius: 5px;//para mozila, mas se não me engano o GC aceita
-webkit-border-radius: 5px;//para navegadores com o motor webkit

E sombra:

text-shadow: 1px 1px 0px #000;//para textos
box-shadow: 1px 1px 0px #000;//para elementos... como div

1º e 2º parametros servem para dizer a deslocação da sombra em x e y.

o terceiro é a desfocagem da sombra e o ultimo, a cor.

Editado Setembro 28, 2010 por vini_loock

[Rafael Laurindo]

Vou testar, qualquer coisa eu posto, qual a diferença de border-radius de -moz-border-radius? O primeiro não funciona no mozilla?

[*FIT*]

O primeiro é o padrão de como vai ficar quando o CSS3 realmente estiver valendo, assim todos funcionarão assim.

O segundo é só para mozilla por enquanto, e o terceiro é para opera e safari se não me engano.

Respondendo a sua primeira pergunta, o CSS3 ainda não está disponivel oficialmente, tanto é que caso queira usar, é preciso usar um comando para cada, como se fosse um tipo de hack para funcionar. ;)

[Rafael Laurindo]

Entendi, mas no caso, só é possível arredondar todos os cantos, ou poderei escolher um, por exemplo?

[_Vinny_]

O border-radius é um elemento que virá com o CSS3, pode esta disponivel em alguns navegadores, porém ainda não foi lançado oficialmente. O grande barato dele é na aparência, Firefox, Chrome, Opera e Safari já suportam a tecnologia, do IE8 para baixo ainda não tem suporte, porém o IE9 Beta parece que terá suporte ao CSS3 e ao HTML5, muito melhor assim.

Veja aqui exemplos e funções: https://developer.mozilla.org/en/CSS/-moz-border-radius

Nesse mesmo link você pode pesquisar sobre outros elementos do CSS3.

[*FIT*]

Respondendo a pergunta sobre poder arredondar cantos especificos, é possível sim. Nesse exemplo passado acima, mostra isso.