Discussion :

[pasc06]

Bonjour,

J'ai un petit souci car je ne suis pas très calé en CSS

Dans cette page : http://www.comeric.fr/HE2/destination.eng.htm

J'aimerais que les liens de la section "Other interesting sites to see:" soient soulignés.

Mais après plusieurs essais je n'y arrive pas...

Ils sont soulignés dans Dreamweaver, mais pas en ligne...

Je ne comprends pas pourquoi...

Merci de votre aide

[HiRoN]

Bonjour,

Pour ma part (via firebug), en rajoutant à .Style6 un text-decoration:underline; le texte "Other interesting sites to see:" est souligné.

[pasc06]

Ce n'est pas le texte "Other interesting sites to see:" que je veux souligner !

Ce sont les liens qui sont dessous !

Merci de ton aide

[HiRoN]

Ce n'est pas le texte "Other interesting sites to see:" que je veux souligner ! Ce sont les liens qui sont dessous !

Sous FF 3.5 & IE 7/8, ils le sont déjà...

[tzilliox]

Bonjour pasc06,

Chez moi, le sliens sont soulignés. Et c'est normal parce que j'ai pas encore cliqué dessus !
En fait tes liens peuvent avoir 4 états en CSS, les voici :
a:link est le sélecteur pour les liens normaux
a:visited est le sélecteur pour les liens visités for visited links
a:hover est le sélecteur pour l'état survolé
a:active est le sélecteur les liens actifs

Si tu veux qu'ils soient surlignés même quand tu as déjà clické dessus, voici le code qu'il te faut :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
a.Style18:link,
a.Style18:visited,
a.Style18:hover,
a.Style18:active, {
color:#666666;
text-decoration:underline;
}

Par contre, cela ne fontionnera qu'avec les liens qui ont une classe Style18. Le souslignement de tous tes liens a été désactivé car tu écris 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
a:link {
	text-decoration: none;
	color: #999999;
}
a:visited {
	text-decoration: none;
	color: #999999;
}
a:hover {
	text-decoration: none;
	color: #666666;
}
a:active {
	text-decoration: none;
}

Tu peux donc supprimer cette partie (et ne pas écrire le code qui se trouve plus haut) si tu veux que tous tes liens soient soulignés.

Bonne chance,
Thomas.

[pasc06]

J'ai ajouté comme tu me l'as conseillé :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
a.Style18:link,
a.Style18:visited,
a.Style18:hover,
a.Style18:active, {
color:#666666;
text-decoration:underline;
}

Effectivement ils sont soulignés sur IE8 (ils l'étaient déjà avant j'avais pas vu !), mais toujours pas sur Firefox 3.5.3 J'ai essayé de vider le cache mais ça ne change rien...)

Normal que les autres liens ne soient pas soulignés, je ne veux les souligner que pour le style 18

Merci de votre aide

[tzilliox]

oups j'ai fait une erreur ! Il y a une virgule en trop sur le dernier sélecteur

C'est mieux comme ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
a.Style18:link,
a.Style18:visited,
a.Style18:hover,
a.Style18:active {
	color:#666666;
	text-decoration:underline;
}

Dis-moi si ça marche !
Thomas.

[pasc06]

Ca marche !

J'avais pas vu non plus la virgule !

Merci

[tzilliox]

De rien pasc06 !

Quelques conseils pour améliorer ton CSS :

• Faire la strucutre de sa page avec des tableaux n'est pas vraiment conseillé. Je te conseille de lire ce site qui explique en quoi la mise en page par tableaux est-elle stupide.
• Organiser son CSS c'est bien ! Chacun fait à sa façon. Je te conseille de séparer les règles de positionnement (width, height, margin, padding, etc.) des règles sur la police (font-size, color, text-align, etc.). Tu peux également ordonner tes règles de façon top-down, c'est-à-dire les règles les plus générales en haut et les plus spécifiques en bas. tu peux lire cette article si ça t'intéresse
• Attention, tu as des erreurs javascript au lancement de ta page !

Bon courage,
Thomas.

[pasc06]

Pour les tableaux en css je sais... Mais bon, pour l'instant je n'ai pas eu le temps de m'y intéresser...

Des erreurs en javascript ? Ah bon ??? Ou ça ? Comment les as tu repérées ?

[tzilliox]

Tu peux voir les erreurs javascript dans la console Firebug :

• missing ) after argument list
• swfobject is not defined

Pour le CSS, je sais que ce n'est pas évident de s'y mettre. Mais tu as fait le plus dur, il ne te reste plus qu'à utiliser le CSS pour la structure de ta page. Or il existe des listes de gabarits comme celle-ci pour t'aider. Par exemple, ce gabarit ressemble un peu à ce que tu veux faire !

Bon courage,
Thomas.

[pasc06]

Je suis bon pour un nouveau post dans le forum javascript !

Car après quelques recherches je ne trouve pas la solution pour "swfobject is not defined"

Apparemment ce sont ces lignes là qui pose souci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<script type="text/javascript">
<!--
swfobject.registerObject("FlashID");
//-->
</script>

Si tu as une idée...

[pasc06]

J'ai trouvé, l'erreur était dans la partie "head" (problème de path !)

Il y avait une majuscule en trop (sur le mot Scripts) !

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>

devient :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<script src="scripts/swfobject_modified.js" type="text/javascript"></script>