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

HTML Discussion :

Problème de classe


Sujet :

HTML

  1. #1
    Membre régulier
    Profil pro
    Inscrit en
    Juillet 2003
    Messages
    99
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2003
    Messages : 99
    Points : 72
    Points
    72
    Par défaut Problème de classe
    Bonjour

    J'ai un problème de css :

    Ceci fonctionne :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    <div class="lien"><a href="url">lien</a></div>
    <div class="lien"><a href="url">lien2</a>
    </div>
    mais ceci ne fonctionne pas (l'image qui doit être affichée lors du rollover n'est pas affichée : elle disparaît et réapparaît dès que le curseur n'est plus au dessus du lien) :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    <div class="lien">
    <a href="url">lien</a><a href="url">lien 2</a>
    </div>
    avec ce code css :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
     
    div.lien {	/* "lien" sera notre conteneur, ici la balise div */
    	position:left;	/* placement de l'image-lien, à vous d'adapter *//
    	text-align:rigth;
    	width: 15px;
    	height: 13px;
    	margin-left:15px;
     
    	background: url(bullet_on.gif) top left no-repeat;	/* placement de l'image 2 au second plan */
    }
     
    div.lien a  {	/* définition du lien qui occupera toute la place du conteneur */
    	display: block;
    	float: left;
    	padding-left: 15px;
    	background: url(bullet_off.gif) top left no-repeat;	/* placement de l'image 1 au premier plan */
    	font: bold 11px Arial, Helvetica, sans-serif;
    	color: #3D7B10;
    	text-decoration: none;
    }
     
    div.lien a:hover{	/* masquage de l'image1 au survol */
    	color: #52A417;
    	font: bold;
    	background: transparent none;
    }
    Je ne comprend pas pourquoi cela fonctionne si je débute et ferme ma balise div après chaque lien mais pas si je fais un div global qui englobe tout mes liens. Le principe est le même. Merci de m'expliquer

  2. #2
    Membre habitué
    Inscrit en
    Août 2005
    Messages
    124
    Détails du profil
    Informations personnelles :
    Âge : 38

    Informations forums :
    Inscription : Août 2005
    Messages : 124
    Points : 133
    Points
    133
    Par défaut
    essaye nomDiv.a{}
    Tout comme la vie, on ne participe pas à une guerre pour la perdre !!!
    PinguY4Ever

  3. #3
    Membre régulier
    Profil pro
    Inscrit en
    Juillet 2003
    Messages
    99
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2003
    Messages : 99
    Points : 72
    Points
    72
    Par défaut
    même problème d'autres idées ?

  4. #4
    Membre éprouvé
    Profil pro
    Inscrit en
    Juin 2002
    Messages
    1 012
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2002
    Messages : 1 012
    Points : 1 093
    Points
    1 093
    Par défaut
    c'est quoi, ta classe lienMenu ?

  5. #5
    Membre régulier
    Profil pro
    Inscrit en
    Juillet 2003
    Messages
    99
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2003
    Messages : 99
    Points : 72
    Points
    72
    Par défaut
    faute de frappe la classe s'appelle bien "lien" ... mais le problème demeure ...

  6. #6
    Membre éprouvé
    Profil pro
    Inscrit en
    Juin 2002
    Messages
    1 012
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2002
    Messages : 1 012
    Points : 1 093
    Points
    1 093
    Par défaut
    non les deux principes diffèrent complètement.

    dans le second, tu apelles une seule fois ta class lien, donc tu n'affiches qu'une seule fois ton image d'arrière plan bullet_on. ensuite tu utilises deux fois ta classe lien a donc tu affiches deux fois ton image bullet_off, laquelle disparaît quand tu passes dessus avec la souris soit la classe lien a:hover

    tandis que dans ta première séquence, tu appelles deux fois le div lien

    j'espère que m'être bien expliqué

  7. #7
    Membre régulier
    Profil pro
    Inscrit en
    Juillet 2003
    Messages
    99
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juillet 2003
    Messages : 99
    Points : 72
    Points
    72
    Par défaut
    merci j'ai résolu le problème par moi même juste avant (d'ou le statut de résolu du message)

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

Discussions similaires

  1. [hibernate]Problème mapping classe association
    Par jsl1 dans le forum Hibernate
    Réponses: 6
    Dernier message: 16/06/2006, 17h27
  2. Problème de classe.
    Par maminova77 dans le forum Langage
    Réponses: 5
    Dernier message: 30/01/2006, 21h39
  3. Problème sur classe Transformer avec les <!--
    Par tykool dans le forum Format d'échange (XML, JSON...)
    Réponses: 1
    Dernier message: 10/01/2006, 10h20
  4. Problème de classe
    Par DeusXL dans le forum DirectX
    Réponses: 15
    Dernier message: 04/12/2005, 14h37
  5. [FLASH MX2004] Problème de classe
    Par JulPoWeR dans le forum Flash
    Réponses: 1
    Dernier message: 10/07/2005, 22h51

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