IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

div avec bord arrondi et transparent


Sujet :

CSS

  1. #1
    Membre habitué
    Profil pro
    Inscrit en
    Octobre 2006
    Messages
    165
    Détails du profil
    Informations personnelles :
    Âge : 48
    Localisation : France, Nord (Nord Pas de Calais)

    Informations forums :
    Inscription : Octobre 2006
    Messages : 165
    Points : 137
    Points
    137
    Par défaut div avec bord arrondi et transparent
    je cherche depuis hier un façon efficace de faire des cadres au coin arrondi sur fond transparent et je desespère de trouver .... faire un des images en png .. çà ne marche pas avec ie6 ... utiliser des javascript style nifty ... le transparent est vraiment à peu près ... sans compter les scripts qui marche avec ie ou netscape mais jamais avec les 2 ...
    est ce que quelqu'un à trouver une façon efficace et qui marche partout ?

  2. #2
    Membre émérite Avatar de Erwan31
    Profil pro
    Inscrit en
    Février 2008
    Messages
    2 177
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2008
    Messages : 2 177
    Points : 2 444
    Points
    2 444
    Par défaut
    Bonjour,
    tu as aussi la bibliothèque Jquery qui te le permet mais bien sûr pas sans JS activé.
    Si ton fond est relativement uni, un png paletted (1>8bits) transparent peut suffire, sinon tu dois en effet passer par un png32 qu'IE 6 peut gérer via une
    extension CSS IE (à placer dans l'idéal dans une feuille de style IE6- appelée avec commentaires conditionnels):
    Exemple:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    .corner_hg {
    	background: none;
    	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='/images/...png');
    	}
    Ça c'est pour une image en background, pour une image en HTML c'est un peu plus compliqué et délicat.

  3. #3
    Membre actif Avatar de Damouille
    Inscrit en
    Avril 2006
    Messages
    268
    Détails du profil
    Informations forums :
    Inscription : Avril 2006
    Messages : 268
    Points : 289
    Points
    289
    Par défaut
    Il esiste une solution css sans image ici

    J'ai testé, ca marche bien sous tous les navigateurs.

  4. #4
    Membre habitué
    Profil pro
    Inscrit en
    Octobre 2006
    Messages
    165
    Détails du profil
    Informations personnelles :
    Âge : 48
    Localisation : France, Nord (Nord Pas de Calais)

    Informations forums :
    Inscription : Octobre 2006
    Messages : 165
    Points : 137
    Points
    137
    Par défaut
    merci à tous les deux et spécialement à Damouille .. j'ai testé et c'est exactement ce que je cherchais ... je desespérais un peu de trouver quelque chose de ce type ;-)

  5. #5
    Membre habitué
    Profil pro
    Inscrit en
    Octobre 2006
    Messages
    165
    Détails du profil
    Informations personnelles :
    Âge : 48
    Localisation : France, Nord (Nord Pas de Calais)

    Informations forums :
    Inscription : Octobre 2006
    Messages : 165
    Points : 137
    Points
    137
    Par défaut
    quelqu'un a les chiffres du nombre de dépression nerveuse dues au CSS ?

    bon j'en suis revenue à une méthode avec des images pour les coins car la méthode sans images n'étaient pas assez nette dans mon cas (j'ai un background très chargé)

    j'ai un soucis avec les images
    lorsque je passe en png32 meme ma couleur de fond devient transparente... si bien que je vois à travers le gris ce qui n'est pas le but
    quelqu'un a une idée ?

  6. #6
    Membre émérite Avatar de Erwan31
    Profil pro
    Inscrit en
    Février 2008
    Messages
    2 177
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Février 2008
    Messages : 2 177
    Points : 2 444
    Points
    2 444
    Par défaut
    Pas très bien saisi ton problème. A priori c'est d'avantage un problème de traitement graphique que de CSS?

  7. #7
    Membre actif
    Profil pro
    Inscrit en
    Janvier 2007
    Messages
    241
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Janvier 2007
    Messages : 241
    Points : 267
    Points
    267
    Par défaut
    Citation Envoyé par malkie Voir le message
    quelqu'un a les chiffres du nombre de dépression nerveuse dues au CSS ?
    Oui, moi...

    Je termine ma psychanalyse et je te raconte tout ça...

    Ah oui c'est vrai je m'étais amusé, il y a un certain temps, à faire un truc un peu fun sur des histoire d'arrondis avec transparence (complète externe, alpha interne) toujours eu la flemme de régler la question pour IE6.


    Pas d'un intérêt flagrant mais si ça peut t'inspirer:

    http://www.clb56.fr/test_css/test_4b.../transparence/

  8. #8
    Membre habitué
    Profil pro
    Inscrit en
    Octobre 2006
    Messages
    165
    Détails du profil
    Informations personnelles :
    Âge : 48
    Localisation : France, Nord (Nord Pas de Calais)

    Informations forums :
    Inscription : Octobre 2006
    Messages : 165
    Points : 137
    Points
    137
    Par défaut
    Citation Envoyé par Erwan31 Voir le message
    Pas très bien saisi ton problème. A priori c'est d'avantage un problème de traitement graphique que de CSS?
    oui c'est surement un problème de paramétrage de l'image
    en fait j'ai fait une image pour chaque coin et je veux que l'exterieur de mon cadre soit transparent mais pas l'interieur qui doit rester opaque .. et j'y arrive pas



    bon l'image que j'ai mis c'est sur un fond bleu donc on ne voit pas trop qu'elle est transparente .. je sais pas si vous voyez mon probleme
    j'utilise firework mais je ne le connais pas bien

  9. #9
    Membre habitué
    Profil pro
    Inscrit en
    Octobre 2006
    Messages
    165
    Détails du profil
    Informations personnelles :
    Âge : 48
    Localisation : France, Nord (Nord Pas de Calais)

    Informations forums :
    Inscription : Octobre 2006
    Messages : 165
    Points : 137
    Points
    137
    Par défaut
    Citation Envoyé par clb56 Voir le message
    Oui, moi...

    Je termine ma psychanalyse et je te raconte tout ça...

    Ah oui c'est vrai je m'étais amusé, il y a un certain temps, à faire un truc un peu fun sur des histoire d'arrondis avec transparence (complète externe, alpha interne) toujours eu la flemme de régler la question pour IE6.


    Pas d'un intérêt flagrant mais si ça peut t'inspirer:

    http://www.clb56.fr/test_css/test_4b.../transparence/
    merci merci je m'en suis largement inspirée ;-)
    pour la psychanalyse moi en rentrant du taf je joue à resident evil 4 sur wii et les gars à dégommer pour moi se trasnforme en div , en float , en align , en left , en right .. çà defoule bien ;-)

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Réponses: 5
    Dernier message: 21/07/2010, 13h38
  2. Fenêtre avec bords arrondis en WPF?
    Par diddy95 dans le forum Windows Presentation Foundation
    Réponses: 3
    Dernier message: 03/11/2008, 06h53
  3. Cadre avec bords arrondis extensibles html+css
    Par Sololupa dans le forum Mise en page CSS
    Réponses: 5
    Dernier message: 12/05/2008, 23h54
  4. Menus avec bord arrondi pour site fluide
    Par HADES62 dans le forum Mise en page CSS
    Réponses: 8
    Dernier message: 14/02/2007, 21h22
  5. [CSS] - une div aux bords arrondis ?
    Par 10-nice dans le forum Mise en page CSS
    Réponses: 12
    Dernier message: 23/09/2005, 15h47

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo