Cadre arrondi sans images

Bonjour,

Est-il possible d'arrodir un cadre avec n'importe quelle couleur sans utilser des images de coins ?

Merci.

Salut apt et bienvenue sur Alsacréations,

si je me souviens bien, j'ai parcouru en vitesse un article sur une méthode en css pour éviter la méthode habituelle et donc, sans image, mais ça fait déjà quelques semaines, et d'ailleurs, si je me souviens bien aussi, je crois ça devait être en css3, donc pas encore vraiment applicable à l'heure actuelle.

Je n'ai plus l'adresse ici, mais si jamais je la retrouve, je te fais signe

à+
Touvert
Modifié par touvert (08 Jan 2007 - 02:19)

re,

voilà, j'ai fais une recherche sur Google et je suis tombé sur le site d'un membre actif d'Alsacréation(gcyrillus), voici donc la page en question : clique ici

à+

Par contre, vu que ça m'intéressais aussi, j'ai essayé mais apparement, il semble y avoir un bug d'affichage .

c'est à peu près ce que j'obtiens avec FF et Mozilla

Si jamais quelqu'un connais le problème.

voici une capture d'écran sur FF :


En fait, si vous regardez bien, les filets verticaux gauches et droits sont entre-coupés sur une petite distance.

merci pour vos réponses

Bonsoir,

Les regles CSS3 permettront les coins arrondis, d'ailleurs les navigateur Mozilla Firefox les prennent déjà en compte mais en règles css spécifique à ces navigateurs.

La méthode donnée par touvert n'est pas plus propre qu'une solution en image (des image en largeur fluide demande elle aussi plusieurs div "vide").

La règle pour avoir des coins arrondi est la suivante :

-moz-border-radius: 5% 5% 0 0;

Attention, ca ne fonctione que sous Firefox !

Pour une méthode beaucoup plus propre, mais avec image lien ici
Modifié par Super_baloo8 (08 Jan 2007 - 03:21)

touvert a écrit :
En fait, si vous regardez bien, les filets verticaux gauches et droits sont entre-coupés sur une petite distance.

Ça ressemble furieusement à une histoire de fusion des marges.

Une autre solution en javascript (non intrusif) : NiftyCube :
http://www.html.it/articoli/niftycube/index.html

testé et approuvé sur un gros projet pro, très souple d'utilisation avec pas mal d'options (choix des coins à arrondir, taille, ....), fiable et bien documenté

Sinon c'est effectivement prévu en CSS3, Mozilla l'applique déjà avec la propriété -moz-border-radius :
http://www.w3.org/TR/2002/WD-css3-border-20021107/#the-border-radius

apt a écrit :
Bonjour,

Est-il possible d'arrodir un cadre avec n'importe quelle couleur sans utilser des images de coins ?

Merci.

Hello et bienvenue,

Oui, tu peux utiliser la propriété CSS3 border-radius qui fera ça très simplement.
Petit hic, elle ne fonctionne pas sur Internet Explorer

EDIT : ah ben grillé plein de fois !
Modifié par Raphael (08 Jan 2007 - 14:28)

Raphael a écrit :
Oui, tu peux utiliser la propriété CSS3 border-radius qui fera ça très simplement.
Petit hic, elle ne fonctionne pas sur Internet Explorer

Ah ben c'est quand même dommage ça que c'est pas dispo sur tous les navigateurs parce que apparemment, c'est une solution simple et efficace.

encore une technologie qui va devoir rester en suspend pendant pas mal de temps avant que ça soit appliqué partout

merci a tous de me souhaiter la bienvenue.

MrPatate a écrit :
Une autre solution en javascript (non intrusif) : NiftyCube :
http://www.html.it/articoli/niftycube/index.html

testé et approuvé sur un gros projet pro, très souple d'utilisation avec pas mal d'options (choix des coins à arrondir, taille, ....), fiable et bien documenté

Sinon c'est effectivement prévu en CSS3, Mozilla l'applique déjà avec la propriété -moz-border-radius :
http://www.w3.org/TR/2002/WD-css3-border-20021107/#the-border-radius

Oui la methode Nifty parrait fonctionnelle.