modifications css ok sur kompozer pas sur navigateur

yayanne · Message par **yayanne** » 28 avr. 2012, 20:01

Bonjour,
je dois monter un site pour ma formation, c'est maintenant chose faite, mais il me reste un problème. Dans un menu latéral, sous menu, les items sont supposés s'afficher en rouge, en noir quandon passe la souris puis en blanc quand ils ont été visités. J'ai essayé différentes couleurs en changeant ca dans la feuille css( a/ a hover/a visisted) aucun problème ca marche super bien, mais dès que je passe sur le navigateur, tout fonctionne super bien, sauf ces fichus items dont les liens fonctionnent mais ils restent blanc du début à la fin.
pourquoi et comment faire?
merci

Message par **Ymai** » 29 avr. 2012, 09:51

Bonjour
Difficile de donner un avis sans pouvoir accéder au code HTML et CSS.
Y a-t-il une version en ligne quelque part? Sinon, copier/coller le code ici pourrait aider.

[edit]Si les items doivent être blancs quand ils ont été visités, ils resteront toujours blancs puisqu'ils ont tous été visités une fois au moins. N'est-ce pas là le problème?[/edit]

yayanne · Message par **yayanne** » 29 avr. 2012, 19:11

ymai,
je ne crois pas que le problème soit là car sur kompozer tout se passe bien et les items sont supposés être noirs soulignés quand on passe dessus, or ils restent blancs!
ceci dit, ta piste est interressante, comment puis-je tester ?merci

Message par **Ymai** » 29 avr. 2012, 19:29

yayanne a écrit :ymai,
je ne crois pas que le problème soit là car sur kompozer tout se passe bien et les items sont supposés être noirs soulignés quand on passe dessus, or ils restent blancs!
ceci dit, ta piste est interressante, comment puis-je tester ?merci

Mon idée était de retourner la question pour que je (et d'autres) puisse(nt) tester.
Une autre idée: l'ordre dans lequel les sélecteurs sont déclarés. Lire à ce sujet http://meyerweb.com/eric/css/link-specificity.html (EN)

yayanne · Message par **yayanne** » 29 avr. 2012, 19:40

j'ai ouvert ton lien, mais j'ai renoncé, tout en anglais, je ne suis pas assez douée dans ces deux domaines que sont l'anglais et l'informatique pour les comprendre simultanément!
je veux bien te transmettre le code, mais là, je ne vois pas comment, je suis ultra débutante et je ne sais pas comment faire ca.
j'ai un autre problème. Sur une de mes pages, dans une meme boite, tous les liens sont supposés avoir le même code couleur(rouges vierges, noirs quand on les survole et blancs visités) ce qui se passe effectivement très bien sur kompozer , et meme sur le navigateur(étrangement par rapport au problème précédent d'ailleurs), mais pour une raison que je n'arrive pas à détecter, seul un lien s'affiche toujours en blanc, tous les autres s'affichent correctement, j'ai vérifié, ils sont tous bien dans la même boite, et je ne vois rien qui les différencie au niveau du code html et du css, je ne comprends pas, il n'y a que sur le navigateur que le problème se pose??????

Message par **Ymai** » 29 avr. 2012, 19:52

Bon, alors, celui-ci mais qui ne fait qu'effleurer le sujet: http://forum.alsacreations.com/topic-1-29444-1.html
Sinon, pour mettre le code HTML à disposition, ce n'est vraiment pas difficile: il suffit de copier/coller...

Code : Tout sélectionner

<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title></title>
</head>
<body>
<br>
</body>
</html>

yayanne · Message par **yayanne** » 29 avr. 2012, 20:13

merci! alors voici une de mes pages sur laquelle figure le code en question, je n'ai pas fait exprès, mais il y a un autre bug sur celle ci, sur kompozer le texte s'affiche clignotant, alors que je ne le voulais pas, mais s'affiche fixe sur le navigateur...en soi, c'est pas très grave mais si je peux comprendre c'est cool!
merci!

Code : Tout sélectionner

<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title>annonces</title>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <link rel="stylesheet" href="monstyle"
 type="text/css">
</head>
<body>
<div id="Main">
<div id="menu">
<ul>
  <li><a href="index.html">Accueil</a></li>
  <li><a href="leclub.html">Le club</a>
    <ul>
      <li><a href="lebureau.html">Bureau</a>
      </li>
      <li><a href="lesentraineurs.html">Entraineurs</a>
      </li>
    </ul>
  </li>
  <li><a href="#">Pratique</a>
    <ul>
      <li><a href="contacts.html">Contact</a></li>
      <li><a href="planning.html">Planning</a></li>
      <li><a href="tarifs.html">Tarifs</a></li>
      <li><a href="inscriptions.html">Inscriptions</a></li>
      <li><a href="calendrier.html">Calendrier</a></li>
    </ul>
  </li>
  <li><a href="actualites.html">Actualités</a></li>
  <li>
    <a href="#">Photos</a>
    <ul>
      <li>
        <a href="lasalle.html">La salle</a>
      </li>
      <li><a href="lescompetitions.html">Compétitions</a></li>
      <li><a href="legala.html">Gala</a></li>
    </ul>
  </li>
  <li><a href="#">Annonces</a>
    <ul>
      <li><a href="emploi.html">Emploi</a></li>
      <li><a href="tenues.html">Tenues</a></li>
      <li><a href="materiel.html">Matériel</a></li>
      <li><a href="divers.html">Divers</a></li>
    </ul>
  </li>
  <li>
    <a href="#">Staff</a>
    <ul>
      <li><a href="Documents.html">Documents</a></li>
      <li><a href="reunions.html">Réunions</a></li>
    </ul>
  </li>
  <h1>A.G.C.V. 5 rue Aimé Césaire 77240 VERT SAINT DENIS</h1>
</ul>
</div>
<br>
<div id="titre">&nbsp; Annonces</div>
<div id="organigramme"><span
 style="font-style: italic; font-weight: bold;">Un
justaucorps trop petit? </span><br
 style="font-style: italic; font-weight: bold;">
<span style="font-style: italic; font-weight: bold;">Des
maniques? </span><br
 style="font-style: italic; font-weight: bold;">
<span style="font-style: italic; font-weight: bold;">Un
service à proposer ou à demander?</span><br
 style="font-style: italic; font-weight: bold;">
<br style="font-style: italic; font-weight: bold;">
<span style="font-style: italic; font-weight: bold;">&nbsp;&nbsp;&nbsp;
N'hésitez pas à nous faire part de vos annonces en nous contactant pour
que nous les publiions ici, et surtout, consultez- les régulièrement!</span></div>
<div id="s_menu">
<ul>
  <li><a href="emploi.html">Emploi</a></li>
  <li><a href="tenues.html">Tenues</a></li>
  <li><a href="materiel.html">Matériel</a></li>
  <li><a href="divers.html">Divers</a></li>
</ul>
</div>
</div>
</body>
</html>

Message par **Ymai** » 29 avr. 2012, 20:43

On peut avoir la feuille de style aussi (le contenu du fichier "monstyle")?

yayanne · Message par **yayanne** » 29 avr. 2012, 20:58

Code : Tout sélectionner

/* Generated by KompoZer */
#Main {
  width: 1024px;
  height: 900px;
  background-image: url(image/fond%20de%20page%20site%20agcv.jpg);
  background-position:  center center;
  margin-right: auto;
  margin-left: auto;
}
#menu {
  border: 4px ridge black;
  font-family: Arial,Helvetica,sans-serif;
  color: white;
  font-style: normal;
  text-transform: none;
  text-align: center;
  background-color: red;
  height: 40px;
  width: 1017px;
  font-size: 15px;
  font-weight: normal;
  line-height: 15px;
}
#menu ul {
  border-color: black;
  border-width: 1px;
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: center;
}
#menu li {
  border-color: black;
  border-width: 1px;
  margin: auto;
  padding: 0;
  float: left;
  background-color: red;
}
#menu li a {
  border-color: black;
  border-width: 1px;
  padding: 5px;
  display: block;
  width: 100px;
  color: white;
  text-decoration: none;
  height: 20px;
}
#menu li a:hover {
  color: black;
}
#menu ul li ul {
  display: none;
}
#menu ul li:hover ul {
  display: block;
  width: 110px;
  text-align: center;
}
#menu li:hover ul li {
  float: none;
}
#menu li ul {
  position: absolute;
}
#menu h1 {
  color: #330000;
  line-height: 25px;
  font-style: italic;
  font-size: 8px;
  text-align: center;
}
#logo {
  margin: 0px 200px 200px 300px;
  height: 500px;
  background-repeat: no-repeat;
  background-image: url(image/logacc.png);
  font-weight: bolder;
  text-align: right;
  color: black;
  background-position: left center;
  width: 650px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: smaller;
  font-style: normal;
  text-decoration: none;
  line-height: 20px;
}
#dessin boite idées {
  margin: 200px 0px 600px 600px;
  width: 350px;
  height: 250px;
}
#pratique {
  background-color: red;
  text-align: center;
  font-weight: bold;
  font-size: x-large;
  font-family: Arial,Helvetica,sans-serif;
}
#s_menu {
  width: 324px;
  font-weight: bold;
  font-family: Arial,Helvetica,sans-serif;
}
a {
  text-decoration: none;
  font-family: Arial,Helvetica,sans-serif;
  color: red;
}
a:hover {
  color: black;
  text-decoration: underline;
}
a:visited {
  color: white;
}
#titre {
  font-family: Arial,Helvetica,sans-serif;
  font-weight: bolder;
  font-size: 60px;
  text-align: center;
  height: 140px;
  margin-left: 95px;
  margin-top: 30px;
  width: 900px;
}
#Le club {
  font-size: 40px;
  color: black;
  font-weight: bold;
  text-decoration: underline;
  text-align: center;
  width: 1024px;
  margin-top: 0px;
  height: 60px;
}
#rubriques {
  font-family: Arial,Helvetica,sans-serif;
  font-size: 18px;
  text-align: left;
  list-style-type: square;
  width: 200px;
  height: 650px;
  color: black;
  list-style-image: url();
}
#texte {
  border-width: 0;
  float: right;
  position: static;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 14px;
  text-decoration: none;
  font-style: italic;
  text-align: justify;
  background-repeat: no-repeat;
  background-position:  center center;
  width: 700px;
  margin-right: 20px;
  list-style-position: inside;
  color: black;
  font-weight: bold;
  background-attachment: fixed;
  height: 90px;
}
#tableau {
  margin-right: 20px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 15px;
  font-style: italic;
  font-weight: bold;
  color: black;
  width: 700px;
  position: static;
  float: right;
}
#organigramme {
  height: 800px;
  width: 700px;
  margin-right: 20px;
  position: static;
  float: right;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: black;
}
#annonce {
  border: 2px dotted red;
  margin: 10px 20px 5px;
  padding: 10px;
  position: static;
  height: 60px;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 12px;
  color: black;
  background-color: white;
  width: 655px;
}
span {
  font-family: Arial,Helvetica,sans-serif;
  font-size: 20px;
  color: red;
  text-decoration: blink;
  width: 700px;
  height: 40px;
  position: static;
}

Ecam · Message par **Ecam** » 29 avr. 2012, 22:44

Si tu travailles sous mozilla ou chrome et que tu fais tes tests sur IE, ça peut expliquer que tes menus ne changent pas de couleurs. Il y a des codes à rajouter pour que IE reconnaisse les différents caractéristiques des menus.

yayanne · Message par **yayanne** » 29 avr. 2012, 23:11

mais justement non, je bosse sous chrome et fais les tests sous chrome?????!

Geckozone

modifications css ok sur kompozer pas sur navigateur

modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Re: modifications css ok sur kompozer pas sur navigateur

Qui est en ligne ?