Cantos arredondados com CSS - border-radius

-Moz-border-radius é uma propriedade que nos permite cantos arredondados com CSS, mas essa propriedade não é uma propriedade padrão, o que significa que nem todos os navegadores suportam.

Um desses navegadores Explorer, era esperado que a nova versão 8, este problema foi resolvido, mas aparentemente não o caso.

Usuários do Firefox podem continuar usando border-radius sem problemas. Safari e Google Chrome para ser baseado no motor do Safari Webkitlos ver se nós add-webkit-border-radius

-Moz-border-radius: 15px; (para Firefox)
-Webkit-border-radius: 15px; (Safari e Google Chrome)

Devemos ter em mente que esses cantos arredondados Explorer será linhas retas, não há como voltar atrás e podemos conseguir que parece o mesmo com todos os navegadores, a menos que use imagens ou javascript.

Em uma última entrada falou sobre border-radius, dissemos que para arredondar cantos com CSS não foi suficiente acrescentamos algo como:

-Moz-border-radius: 15px;
-Webkit-border-radius: 15px;
border: 3px solid # cc6666;

Naturalmente, devemos acrescentar em estilos que queremos arredondar os cantos. Sempre colocando como um esqueleto de pessoal na barra lateral seria:

#sidebar-wrapper {

-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border: 3px solid #cc6666;
más estilos...
}

e no Post:

.post {
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border: 3px solid #cc6666;
más estilos...
}

Tipos de Bordas:

TODAS AS BORDAS CURVAS

-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border: 3px solid #cc6666;

INFERIOR DIREITA

-moz-border-radius-bottomright: 15px;
-webkit-border-radius-bottomright: 15px;border: 3px solid #cc6666;

INFERIOR ESQUERDA

-moz-border-radius-bottomleft: 15px;
-webkit-border-radius-bottomleft: 15px;
border: 3px solid #cc6666;

SUPERIOR DIREITA
-moz-border-radius-topright: 15px; 
-webkit-border-radius-topright: 15px; 
border: 3px solid #cc6666;

SUPERIOR ESQUERDA
-moz-border-radius-topleft: 15px; 
-webkit-border-radius-topleft: 15px; 
border: 3px solid #cc6666;

SUPERIOR DIREITA E INFERIOR ESQUERDA

-moz-border-radius-bottomleft:15px;
-moz-border-radius-topright:15px;
-webkit-border-radius-bottomleft: 15px;
-webkit-border-radius-topright: 15px;
border: 3px solid #cc6666;