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 :

Empêcher le soulignement d'un lien


Sujet :

HTML

  1. #1
    Membre éclairé Avatar de solorac
    Inscrit en
    Avril 2007
    Messages
    483
    Détails du profil
    Informations personnelles :
    Âge : 55

    Informations forums :
    Inscription : Avril 2007
    Messages : 483
    Par défaut Empêcher le soulignement d'un lien
    Bonjour la communauté,

    J'ai une div nommée "corps" qui possède une propriété :

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    div#corp a{
    color: #4569AF; 
    text-decoration:1px solid #777777;
    }

    A l'intérieur de cette div, j'ai une class nommée "Thumbs" dans laquelle je voudrais que le soulignement n'apparaisse pas.

    J'ai essayé :

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    .thumbs a:hover {border-bottom:none;}

    Mais cela ne fonctionne pas. Auriez-vous une idée ??

    Merci

  2. #2
    Membre éprouvé
    Profil pro
    Inscrit en
    Mai 2009
    Messages
    167
    Détails du profil
    Informations personnelles :
    Âge : 38
    Localisation : France

    Informations forums :
    Inscription : Mai 2009
    Messages : 167
    Par défaut
    Salut,

    Dans ta div thumbs, tu rajoutes :

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    .thumbs a {
      text-decoration: none;
    }

  3. #3
    Membre éclairé Avatar de solorac
    Inscrit en
    Avril 2007
    Messages
    483
    Détails du profil
    Informations personnelles :
    Âge : 55

    Informations forums :
    Inscription : Avril 2007
    Messages : 483
    Par défaut
    Désolé, mais cela ne fonctionne pas.

  4. #4
    Membre Expert Avatar de HiRoN
    Homme Profil pro
    Développeur Web
    Inscrit en
    Août 2007
    Messages
    2 035
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Août 2007
    Messages : 2 035
    Par défaut
    Bonjour,

    Sûrement un problème d'héritage.
    Avoir l'ensemble du code (X)HTML & CSS aiderait (le text-decoration sur div#corp a primant sûrement sur la class).
    Pensez à utiliser les ressources disponibles en Dev. Web :
    (x)HTML : Cours (X)HTML / FAQ (X)HTML
    CSS : Cours CSS / FAQ CSS / Galerie CSS
    Javascript : Cours / FAQ / Sources
    Mon site : Développeur Web Freelance

  5. #5
    Membre éclairé Avatar de solorac
    Inscrit en
    Avril 2007
    Messages
    483
    Détails du profil
    Informations personnelles :
    Âge : 55

    Informations forums :
    Inscription : Avril 2007
    Messages : 483
    Par défaut
    Je vous mets en pj les deux fichiers.

    En plus de ma question sur le soulignement des liens, pourriez-vous me donner vos idées sur deux autres points ?

    1 - Le décalage en bas de la balise right (propriété float right). Dans ie8, j'arrive à résoudre en mettant une margin-top négative, mais cela ne fonctionne pas avec FF et Chrome. Il existe certainement un code plus adapté.

    2 - Le point (1 pixel certainement), qui s'affiche en bas de mes div (left et right).

    Et enfin comment faire un retour ligne et saut d'une ligne (<br> dans ie) avec Chrome et FF ?

    Je vous remercie.

  6. #6
    Membre éprouvé
    Profil pro
    Inscrit en
    Mai 2009
    Messages
    167
    Détails du profil
    Informations personnelles :
    Âge : 38
    Localisation : France

    Informations forums :
    Inscription : Mai 2009
    Messages : 167
    Par défaut
    Bonsoir.

    Voilà j'ai étudié un peu t'es fichiers. Je viens de trouver le problème.

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    div#corp a:hover{
    color: #009900;
    border-bottom:1px solid #777777;
    }
    Ici, tu appliques une bordure en dessous des liens contenus dans la div corp.

    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
     
    <div id="corp">
    <!-- Je ne mets pas tout le code pour ne pas surcharger la page -->
    <!-- tu a donc toutes les autres div etc ici jusqu'a ... -->
    <h2>Quelques magasins d'adhérents</h2>
    			<p class="thumbs">
    			<a href='javascript:centrepopup("magcaa.htm","Fencent",700,525,"menubar=no,scrollbars=no,statusbar=no")' class="test"><img src="images/caamag.jpg" width="75" height="75" alt="Comptoir" /></a>
    			<a href='javascript:centrepopup1("magmeai.htm","Fencent1",700,525,"menubar=no,scrollbars=no,statusbar=no")'><img src="images/meaimag.jpg" width="75" height="75" alt="M.E." /></a>
    			<a href='javascript:centrepopup2("magsas.htm","Fencent2",700,525,"menubar=no,scrollbars=no,statusbar=no")'><img src="images/sasmag.jpg" width="75" height="75" alt="Sports" /></a>
    			<a href='javascript:centrepopup3("magapa.htm","Fencent3",700,525,"menubar=no,scrollbars=no,statusbar=no")'><img src="images/apamag.jpg" width="75" height="75" alt="Al" /></a>
    			<a href='javascript:centrepopup4("magopa.htm","Fencent4",700,294,"menubar=no,scrollbars=no,statusbar=no")'><img src="images/opamag.jpg" width="75" height="75" alt="Oran" /></a>
    			<a href='javascript:centrepopup5("magberard.htm","Fencent5",700,505,"menubar=no,scrollbars=no,statusbar=no")'><img src="images/magberard.jpg" width="75" height="75" alt="Befdy." /></a>
    			</p>
     
    </div>
    Ici, ton paragraphe thumbs et contenu dans la div corp ce qui implique que t'es liens hérites de la caractéristique
    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    border-bottom: 1px solid #777777;

    De ce que j'ai vu, tu appliques une class aux autres liens qui ne sont pas contenu dans le thumbs.

    Modifie légèrement le border-bottom de ta div corp

    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    div#corp .link:hover{
    color: #009900;
    border-bottom:1px solid #777777;
    }

    De cette manière, tu n'as plus le trait sous les liens dans le paragraphe thumbs.

    En ce qui concerne ton décalage de la div right, je suis sous FF3.5 et je ne le vois pas. Ou alors je ne regarde pas ou il faut.

    Et pour ton point en bas des div right et left, c'est a cause de t'es hr. Mais je nai pas trouvé de solution désoler.

    En tout cas, essaye ce que je t'ai dit et donne moi un retour.

    Bon courage

    Doki.

  7. #7
    Membre éclairé Avatar de solorac
    Inscrit en
    Avril 2007
    Messages
    483
    Détails du profil
    Informations personnelles :
    Âge : 55

    Informations forums :
    Inscription : Avril 2007
    Messages : 483
    Par défaut
    c'est nickel merci encore.
    Pour ce qui est du point, il s'agit bien de <hr>, j'ai réussi à "contourner" le problème en rendant le point de la même couleur que le background. Mais j'ai des couleurs différentes de background dans mon site donc... faut faire un choix !!!

    A+

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

Discussions similaires

  1. [Vxi3] Comment empêcher le formatage dans un lien hypertexte
    Par GAEREL dans le forum Webi
    Réponses: 2
    Dernier message: 08/10/2010, 15h42
  2. différence IE et FF pour soulignement d'un lien
    Par Stéph utilisateur d'acces dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 12/01/2009, 20h26
  3. style de souligné pour un lien
    Par bractar dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 05/07/2007, 01h59
  4. Supprimer le souligne d'un lien?
    Par wormseric dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 02/11/2006, 10h29
  5. Enlever le souligne d'un lien en javascript?
    Par wormseric dans le forum Général JavaScript
    Réponses: 9
    Dernier message: 31/10/2006, 18h43

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