• imprimer
  • aide

Forum de discussions « XHTML - HTML - CSS »

Retrouvez les publications relatives à ces discussions dans nos rubriques CSS, HTML, XHTML.

Rectangle arrondis sans images

liste des forums liste des discussions Participer à la discussion

Photo de gemmenco Message publié le jeudi 12 août 2010 - 11h03 par gemmenco.
Bonjour,

J'ai essayé de faire une recherche qui me permette de faire un rectangle à coins arrondis sans devoir passer par l'ancien tableau à 9 cellules avec (4 images).

Ce que je cherche : Une solution plus rapide qui permette de conserver la transparence du fond de mes arrondis. Que je puisse facilement en faire qu'un ou plusieurs arrondis à mon rectangle.
Enfin, que cette technique soit bien entendu par les principaux navigateurs

Ce que j'ai déjà trouvé :
- une solution automatique mais qui multiplie les div et qui fonctionne encore avec des images png : http://www.roundedcornr.com/
- chez alsacreation, le code "border-radius" idéal en théorie mais il ne fonctionne pas sur... Explorer 8 !!!
- Le script Roundies.js, assez laborieux à mettre en place et destiné à... Explorer 8 !!!
... et il y a les extensions .htc pour Internet Explorer mais si les arrondis réguliers fonctionnent, impossible de varier (ou de supprimer) des arrondis d'un même rectangle (bug uniquement dans Explorer 8 !!!)

Encore une galère html ???
Photo de HechMan Message publié le jeudi 12 août 2010 - 22h31 par HechMan.
Bonjour,

Je croix que c'est "-webkit-border-radius" pour IE.
Pour la portablilité vers tous les navigateur et puisque CSS3 n'est pas encore normé il faut/faudrait mettre :
"-moz-border-radius : 0px; -webkit-border-radius : 0px; border-radius : 0px;"

Sinon tu peux abandoner IE et Micro$oft...

Au passage si tu veux m'aider : http://www.allhtml.com/forums/posts_list/topic:508802

Dis nous si ça marche!
Photo de nours312 Message publié le samedi 14 août 2010 - 19h50 par nours312. modérateur nours312.com -- je ne suis pas codeur bénévol, mais j'aide gratos ;)
en faite ::
-moz-border-radius:5px; /* c'est pour mozilla FF */ -khtml-border-radius:5px; /* pour linux */ -webkit-border-radius:5px; /* c'est pour safari & gogole chrome */ border-radius:5px; /* norme CSS3 */

t'as des script JS tels que : http://www.dillerdesign.com/experiment/DD_roundies/
ou des fichier en .htc tels que : border-radius.htc

et qui s'utilisent :
behavior: url(border-radius.htc);


Voilà !... @++

liste des forums liste des discussions Participer à la discussion

Vous devez obligatoirement vous identifier en tant que membre pour participer à cette discussion.

ACCÉS COMMUNAUTÉ

Rejoignez ALL HTML

Publiez vos articles, actualités, communiqués ... Donnez votre avis, partagez votre réseau, rencontrez d'autres membres et participez à la vie de la communauté.

Les 5 dernières discussions