Opera et border-radius

**kaiser59** · 05/11/2011, 17h33

Bonjour,

J'espère ne pas être le seul dans mon cas ^^ mais lorsque j'écris ce bout de code par exemple :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!DOCTYPE html>
<html>
<head>
	<style>
        .imgArr {       
        -moz-border-radius:30px;
        -webkit-border-radius:30px;
        -o-border-radius:30px;
        border-radius:30px;}
        </style>
</head>
<body>
<img class="imgArr" src="trance_big2.jpg" />
</body>
</html>

Sous firefox l'image est bien arrondie mais pas sous Opera alors que c'est la dernière version.... qui est censé prendre en compte les propriétés css3

Ce qui me parait étonnant c'est que lorsque je vais sur le site d'opera, celui-ci en l’occurrence, les images sont bien arrondies. Il est bien mentionné que "Border-radius" est bien en compte ! Alors pourquoi cela ne fonctionne pas

**NoSmoking** · 06/11/2011, 00h34

Bonsoir,
as tu essayé de mettre l'image en background ?

**kaiser59** · 07/11/2011, 17h55

Envoyé par NoSmoking

Bonsoir,
as tu essayé de mettre l'image en background ?

Je viens de tester, effectivement j'ai bien des coins arrondis cependant, cela veut dire quoi ? Que pour opera je suis obligé de mettre dans les balises div mes images....

**NoSmoking** · 08/11/2011, 19h21

Envoyé par kaiser59

Je viens de tester, effectivement j'ai bien des coins arrondis cependant, cela veut dire quoi ? Que pour opera je suis obligé de mettre dans les balises div mes images....

et même en background si j'observe le comportement.
La spécification indique pourtant que cela devrait s'appliquer à TOUT type d'élément http://www.w3.org/TR/css3-background/#the-border-radius

**adiGuba** · 09/11/2011, 15h17

Salut,

Envoyé par kaiser59

Je viens de tester, effectivement j'ai bien des coins arrondis cependant, cela veut dire quoi ? Que pour opera je suis obligé de mettre dans les balises div mes images....

Cela signifie tout simplement que c'est un bug d'Opera.

Tu as deux solutions :

Tu modifies ton code pour avoir quelque chose compatible avec tous les navigateurs.
Tu laisses un visuel "dégradé" dans Opera avec des images sans bord-arrondis (jusqu'à ce que le bug soit corrigé).

a++

PS : Au passage -o-border-radius n'existe pas et est donc complètement inutile...

**kaiser59** · 13/11/2011, 17h50

Envoyé par adiGuba

Salut,

Cela signifie tout simplement que c'est un bug d'Opera.

Tu as deux solutions :

Tu modifies ton code pour avoir quelque chose compatible avec tous les navigateurs.
Tu laisses un visuel "dégradé" dans Opera avec des images sans bord-arrondis (jusqu'à ce que le bug soit corrigé).

a++

PS : Au passage -o-border-radius n'existe pas et est donc complètement inutile...

On attendra après la correction du bug alors ^^

Pour le -o-border-radius, j'ai vu qu'il existait le -o-border-image je me suis dit autant tester au cas où

Merci

**adiGuba** · 14/11/2011, 08h41

Envoyé par kaiser59

Pour le -o-border-radius, j'ai vu qu'il existait le -o-border-image je me suis dit autant tester au cas où

Le préfixe n'existe pas toujours.
Il est utilisé pour des propriétés non-standard ou pour des propriétés standard incomplètes ou qui ne sont pas encore finalisé (en "Candidate Recommendation")

A ma connaissance, la doc la plus à jour sur ce sujet est la "CSS Reference" de Mozilla : https://developer.mozilla.org/en/CSS_Reference

a++

**kaiser59** · 15/11/2011, 23h02

Envoyé par adiGuba

...
A ma connaissance, la doc la plus à jour sur ce sujet est la "CSS Reference" de Mozilla : https://developer.mozilla.org/en/CSS_Reference

a++

Sympa je ne connaissais pas merci à toi

**adiGuba** · 16/11/2011, 08h41

Envoyé par kaiser59

Sympa je ne connaissais pas merci à toi

De rien !

Tu as aussi le "Mozilla Extensions" qui référence tous les -moz : https://developer.mozilla.org/en/CSS...lla_Extensions

Par contre c'est moins complet et beaucoup sont spécifique à Mozilla sans rapport avec aucune norme...

a++

Opera et border-radius [CSS 3]

CSS

Discussions similaires

Partager

Partager