[Réglé - Merci] Probleme avec "a.hover"

Salut et bravo pour ce site/forum.

Je commence juste avec le CSS, et encore avec Dream (pour l'instant je ne code pas) et j'ai un pb avec mes a.hover. Je m'explique.

J'aimerais mettre différents a.hover sur une même page, mais ça marche pas ou plutôt il n'y en a qu'un qui est pris en compte et qui s'applique partout.

D'ou ma question : est ce possible ?

si oui comment avec dreamweaver ?

Lerci d'avance

-----------------------------------

ps = quel est le nom de ce forum svp, il m'a l'air top
(j'ai bien cliquer sur Powered by Phedio v3.7.2 mais je vois pas)
Modifié par GTi (18 Apr 2005 - 15:16)

Salut et bienvenu à toi,
pour ton problème, c'est plutôt a:hover et non a.hover, le . exprime une classe, le # un ID, et les : des pseudo classes comme :hover :active ou autre...

Pour le forum, c'est bien Phedio, mais c'est un forum en phase de developpement et de tests non disponible au public.

Pourrais tu par ailleurs editer ton titre de sujet en mettant problème et non pb et enlever big puisque ça n'apporte rien comme informations
Modifié par Olivier (26 Mar 2005 - 20:07)

Merci Olivier mais vois tu une solution pour mon probleme a:hover ?

GTi a écrit :
Merci Olivier mais vois tu une solution pour mon probleme a:hover ?

il faut utiliser des classes pour affecter différemment chaque lien...

Ehhhh mais je te l'ai donné la réponse

Moi même a écrit :

pour ton problème, c'est plutôt a:hover et non a.hover

Je suis arrivée ici avec a:hover !

Le topic est un peu long, mais à la fin, page 2, il y a des explications qui t'ouvriront sûrement des portes :

Conflit de propriétés - Règles de spécificités
Modifié par Vero (26 Mar 2005 - 22:22)

Merci les gars mais comme je l'ai dit plus haut je ne suis pas un spécialiste des CSS et je me sert que de DREAM.

Donc pouvez vous me donner des exemples concret ou m'expliquer plus en detail.

Voici mes fichiers (2 css + 1 html) pour vous montrer mes pb. Il y a bien une class pour chaque avec un a:hover chacun mais c'est un des deux a:hover qui s'apllique a second.

merci d'avance
Modifié par GTi (26 Mar 2005 - 22:39)

Oui, mais tu vas être obligé de t'y mettre, dream a ses limites ...

.test1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #CC0000;
	text-decoration: none;
}
a.test1:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #FF9900;
	text-decoration: none;
}

.test2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #006699;
	text-decoration: none;
	font-weight: bold;
}
a.test2:hover {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	color: #009933;
	text-decoration: underline;
}

Modifié par Stephan (26 Mar 2005 - 22:32)

Mais ça c'est mieux :

a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
}
a.test1 {
	color: #CC0000;
}
a.test1:hover {
	color: #FF9900;
}
a.test2 {
	color: #006699;
}
a.test2:hover {
	color: #009933;
	text-decoration: underline;
}

Modifié par Stephan (26 Mar 2005 - 22:39)

Merci Stef en effet ça marche avec ton code.

Mais si je veut attribuer disons une taille de texte différente à : a.test1 = 12 et a.test2=14, comment faire ?

Encore une question: toujours dans dream, vaut t il mieux définir dans : "seulement ce document" ou "Nouveau fichier fezuille de style"

arfff...

Si tu veux du soutient pour Dreamweaver, tu es mieux de t'inscrire sur le forum http://dream.media-box.net/

Sinon, on a d'excellents tutos que je t'invite à lire
=> http://css.alsacreations.com/

merci de votre aide mais je n'y arrive pas. J'essai avec seulement ce document ou avec les fichiers externes pas moyen.

Ton code est ok mais moi dans dream pas moyen je n'ai qu'un a:hover qui s'applique partout.

GTi a écrit :
Encore une question: toujours dans dream, vaut t il mieux définir dans : "seulement ce document" ou "Nouveau fichier fezuille de style"

puis

GTi a écrit :
Oui merci Vero, ça c'est bon je connait et comprend le principe et j'ai l'habitude de travailler avec des feuilles externes.

Ha ! Désolée de ne pas avoir compris la question ...

Ha ! les conflits a:hover ...
Modifié par Vero (27 Mar 2005 - 18:46)

Oui merci Vero, ça c'est bon je connait et comprend le principe et j'ai l'habitude de travailler avec des feuilles externes.

Le pb est sur les a:hover. Voici mes CSS de base qui marchent neekel :

a écrit :
.colonne_gauche {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #0066CC;
text-decoration: none;
}

a écrit :
.colonne_droite {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #CC0000;
text-decoration: none;
}

jusque la tout va bien les polices, la taille et la couleur s'applique comme je veut.

Mais si je rajoute un a:hover comme ceci :

a écrit :
.colonne_gauche {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #0066CC;
text-decoration: none;
}
a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #0066CC;
text-decoration: underline;
}

a écrit :
.colonne_droite {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #CC0000;
text-decoration: none;
}
a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #CC0000;
text-decoration: underline;
}

A ce moment la le a:hover .colonne_droite s'applique aussi a colonne_gauche.

Je voudrais pouvoir appliquer un a:hover différent a gauche, à droite et d'autres encore...

Cela est t il possible ?

Si oui comment ?

Merci

ps= désolé pour l'acharnement mais je doit mettre mon site en ligne mardi et j'ai pas fini.
Modifié par GTi (27 Mar 2005 - 16:50)

bonjour,
je pense que la solution a ton probleme doit pouvoir se resoudre comme ceci

.colonne_gauche {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #0066CC;
text-decoration: none;
}
.colonne_gauche a:hover {    [#red]<= noter comme ça, la a:hover s'appliquera a la colonne de gauche. tu fais pareil pour celle de droite en marquant ".colonne_droite a:hover[#black]
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #0066CC;
text-decoration: underline;
}

En effet cette derniere méthode marche pour appluqer plusierus a:hover différent mais j'ai un nouveau pbroblème :

Maintenant c'est : text-decoration: underline; qui ne s'applique plus.

La police est ok la couleur aussi mais lorsque je teste ma page je n'ai aucun effet visible.

voici les 2 codes 2 css que j'utilise :

a écrit :
.colonne_gauche {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #0066CC;
text-decoration: none;
}
.colonne_gauche a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #0066CC;
text-decoration: underline;
}

a écrit :
.colonne_droite {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #CC0000;
text-decoration: none;
}
.colonne_droite a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #CC0000;
text-decoration: underline;
}

je n'ai fait que recopier le code donner au post d'avant.

Merci d'avance
Modifié par GTi (31 Mar 2005 - 17:11)

bonsoir,

as tu un url de ta page pour voir ça en direct parce que comme ça c'est pas facile ( pour moi en tout cas)

Non le site n'est pas en ligne, mais peu tu me ontacter sur msn par exemple pour dialoguer en live. Ce sera le plus simple je pense.

voir profil.

encore merci

Bonjour GTi

Tout l'intérêt d'un forum est que les réponses sont disponibles pour tous

Donc commencer une discussion sur le forum et la finir en privé, ce n'est pas sympa pour les autres utilisateurs