28172 sujets

CSS et mise en forme, CSS3

[Résolu] Alink, vlink,... ne font pas leur effet sur éléments menu

Bonjour,
Le titre est scabreux (sans doute comme mon code CSS), je m'explique :
J'ai réalisé ma page d'accueil et tout roule... sauf les CSS gérant la liste des éléments du menu !
Voila les CSS du début du programme (partie concernée) :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type" />
  <title>Accueil Aînés Ruraux 22</title>
  <style type="text/css">body { background-color: rgb(255, 255, 204); font-family: "times new roman", georgia, times, serif; font-size: medium; line-height: 120%; }
.colgch { width: 15%; color: blue; float: left; }
.menu { font: 2em; text-align: center ; strong: ; font-size: x-large; font-family: "comic sans ms", verdana, geneva,arial, sans-serif; line-height: 180% }
a: link { color: #696; text-decoration: none; }
a: visited { color: #699; text-decoration: none; }
a: hover { color: #c93; text-decoration: underline; }
a: active { color: #900; text-decoration: underline; }
#navigation { list-style: none ; margin: 0 ; padding: 0; }
#navigation li{ background: #efe54d ; color: blue ; border: 1px solid #600 ; margin-bottom: 1px ; text-align: center ; }
#navigation li a { display: block; background: #ffff80 ; color: #00c0ff ; font: 1em "Comic Sans MS" ; margin-bottom: 1px ; text-align: center ; text-decoration: none ; }
.colreg { color: yellow; float: right; }

Vers les 13-16éme ligne, on a a: link , a: visited ,...
Voici le code HTML correspondant
<br />
<div class="menu">
Menu</div>
<ul id="navigation">
  <li><a href="http://ar22.ifrance.com/index.html">Objectifs</a></li>
  <li><a href="http://ar22.ifrance.com"
 title="aller en 2">Organisation</a></li>
  <li><a href="http://ar22.ifrance.com"
 title="aller en 3">Actualité</a></li>
  <li><a href="http://ar22.ifrance.com"
 title="aller en 4">Activités</a></li>
  <li><a href="http://ar22.ifrance.com"
 title="aller en 5">Avantages</a></li>
  <li><a href="http://ar22.ifrance.com"
 title="aller en 6">Partenaires</a></li>
  <li><a href="#" title="aller en 7">Plan du
Site</a></li>
  <li><a href="#" title="aller en 8">Notre
Blog</a></li>
  <li><a href="mailto:ar22@ifrance.com"
 title="aller en 9">Contactez-nous</a></li>
</ul>
</div>
<div class="colreg">

Ca fonctionne au niveau des quelques liens (pour essais) que j'ai mis mais ce sont les changements de couleur, gérés par la CSS, qui ne suivent pas !
Merci de m'indiquer (positionnement ou références ou autres) ce qui ne fonctionne pas !
Merci, plus encore, de votre indulgence : j'ai commencé à m'intéresser à la construction d'un site voici 3 semaines et par la recherche sur le net (puis impression) de cours HTML et CSS (200 pages) : il faut les ingurgiter, sachant que ça ne fera jamais le tour du sujet !!
@ bientôt et au plaisir de vous lire RJL20080411

Toutes mes excuses pour une présentation sans indentations sachant que je n'ai pas réussi à en avoir avec Kompozer : si j'en mets manuellement, il les détruit lors de la sauvegarde !
Modifié par rjl (12 Apr 2008 - 16:28)
Bonjour rjl

Cela devrait mieux fonctionner sans espace après les 2 points


a:link { color: #696; text-decoration: none; }
a:visited { color: #699; text-decoration: none; }
a:hover { color: #c93; text-decoration: underline; }
a:active { color: #900; text-decoration: underline; }
Bonjour knarf
Merci de ta réponse que j'ai appliquée : c'était une condition nécessaire mais pas suffisante !
J'avais pensé à l'espace mais j'ai mal regardé confondant les a: href avec les a:visité et compagnie !
Mais, comme je l'écris, je ne suis pas à une erreur près et peut en faire bien d'autres !
En fait, j'ai passé ma batterie de a:link... après les #navigation qui correspondent à la liste menu et j'ai de plus ajouté un.navigation devant mes a:link !
Lequel des 2 a participé à la correction ou les 2 sont-ils indispensables ? Je suis un peu léger en ce domaine te vais "réviseré !
.menu { font: 2em; text-align: center ; strong: ; font-size: x-large; font-family: "comic sans ms", verdana, geneva,arial, sans-serif; line-height: 180% }
#navigation { margin: 0 ; padding: 0; }
#navigation li{ background: #efe54d ; color: blue ; border: 1px solid #600 ; margin-bottom: 1px ; text-align: center ; }
#navigation li a { display: block; background: #ffff80 ; color: #00c0ff ; font: 1em "Comic Sans MS" ; margin-bottom: 1px ;
text-align: center ; text-decoration: none ; line-height: 180% }
#navigation a:link { color: #00f ; text-decoration: none ; border-bottom: 1px solid black ; }
#navigation a:visited { color: #c0c ; text-decoration: none ; border-bottom: 1px solid purple ; }
#navigation a:hover { color: #0f0 ; }
#navigation a:active { color: #f00 ; }
.colreg { color: yellow; float: right; }

Encore merci et à plus RJL20080412
Sujet clos
Aller à