3 navigateurs : 3 comportements différents

[nomasis]

Bon j'ai viré le bout de code Javascript pensant que c'était lui qui nous jouait des tours.

Eh bien non : la 1ère page est toujours pareil !

Par contre et c'est extrèmement surprenant : si tu te balades dans certaines catégories du blog tu peux voir que les différents liens de la CSS sont correctement interprétés.

Sauf là : http://nomasis.com/nomablog/index.php/?Humurs, par exemple.

Il y a un bug ! Mais où ? Je cherche...

[Perrine]

Si tu regardes bien le tire du 3ème billet est lui aussi écris en blanc... sur blanc, donc il est invisible.

"Mis en examen pour avoir dénoncé la mauvaise qualité d'un logiciel"

Le Javascript est à moi : je vais le virer.

<{POST_SNAPBACK}>

Je le vois noir. En revanche, le comportement du a:active est effectivement blanc

Remplace ça :

/* Liens
******************************************/
a:link{color:#000;}
a:visited{color:#844;}
a:hover{color:#000;}

par ça :

/* Liens
******************************************/
a:link,a:hover,a:active{color:#000;}
a:visited{color:#844;}

[Perrine]

Bon j'ai viré le bout de code Javascript pensant que c'était lui qui nous jouait des tours.

Eh bien non : la 1ère page est toujours pareil !

Je ne suis pas d'accord. Le seul lien blanc qui existait en savoir plus a disparu ... Maintenant, tous les liens sont affichés correctement

Par contre et c'est extrèmement surprenant : si tu te balades dans certaines catégories du blog tu peux voir que les différents liens de la CSS sont correctement interprétés.

Sauf là : http://nomasis.com/nomablog/index.php/?Humurs, par exemple.

Il y a un bug ! Mais où ? Je cherche...

<{POST_SNAPBACK}>

Là encore, je ne suis pas d'accord, tout s'affiche correctement chez moi. Même sur IE (sans parler du menu bien sûr, je regarderai ce soir pour le menu du header)

[nomasis]

Alors bon... que chez toi cela s'affiche correctement alors que sur mon poste je vois les liens blancs, je crois savoir pourquoi :

En tatonnant je me suis apperçu que seuls les liens visités se retrouvaient blancs.

J'ai donc viré le a:visited dans le #header a:.

Et je retrouve des liens lisibles.

Mais c'est tout de même curieux.

[Perrine]

Bizarre bizarre ... Enfin !

J'ai vu que tu avais modifié la couleur des liens visités ... as-tu essayé de remettre le a:visited dans le #header ?

Sinon, à part le menu pour IE, on est bon là ?

Dans ta feuille de style, il y a plein de XHTML, c'est quoi ?

[nomasis]

Bizarre bizarre ... Enfin !

J'ai vu que tu avais modifié la couleur des liens visités ... as-tu essayé de remettre le a:visited dans le #header ?

euh nan... tiens je vais regarder

Sinon, à part le menu pour IE, on est bon là ?

il y a l'histoire des filets en bord de page aussi; mais c'est pas de la première urgence non plus.

Dans ta feuille de style, il y a plein de XHTML, c'est quoi ?

<{POST_SNAPBACK}>

euh... j'ai beau chercher de mon côté : je ne vois pas une goutte de XHTML dedans.

Tu vois quoi toi ? (ça m'inquiète)

[Perrine]

AH non pardon .. c'est moi lol j'utilise la barre d'outils Web Developper de FF et j'affiche la css avec. Il me met le code XHTML de la page ... ok, j'ai rien dit

Il faut revoir le footer, il part un peu en cacahuète

Et dans ta CSS

/* Footer ****************************/
#footer{
	clear: both;
	width: 750px;
	height: 24px;
	margin: 0 auto;
	padding: 0;
	background: url(img/piedbar.jpg) no-repeat center;
	text-align: center;
}

#footer a, #footer a:visited, #footer a:hover {
	text-decoration: none;
	color: #999;
	background: transparent;
}
#footer ul{
color: #FFFFFF;
}

#footer ul>li{
display:inline;
}

#footer a:link,a:active{
text-decoration: none;
color: #FFFFFF;
}

#footer a:hover{ /* <--- déjà défini */
color: #CCCCCC;
}

Attention, tu définis plusieurs fois la même chose (a:hover)

Le #footer a du début n'est pas utile puisque par la suite, tu définis les 4 états possible du a (link, hover, active et visited)

[Perrine]

Tu as ça en haut de ta CSS

* { padding: 0; margin: 0; border: 0; }

Tu peux donc virer tous les margin:0 que tu as dans les sélecteurs car ils vont hériter des attributs de leurs parents (le bloc conteneur)

Hop, encore un peu de lecture pour comprendre l'héritage

[Perrine]

J'ai vaincu la bête !

Voici le XHTML pour le header :

<div id="header">
  <ul>
    <li id="t-accueil"><a href="#">accueil</a></li>
	<li id="t-menu"><a href="#">menu</a></li>
	<li id="t-contenu"><a href="#">contenu</a></li>
	<li id="t-nomasis"><a href="#">nomasis</a></li>
  </ul>
  <div id="recherche">
    <form action="/nomablog/index.php/" method="get">
    <p>rechercher <input name="q" id="q" type="text" size="15" value="" accesskey="4" /><input type="submit" class="submit" value="ok" /></p>
    </form>
  </div>
</div>

et la CSS :

*{
margin:0;
padding:0;
}

body{
font-size:0.8em;
font-family:Tahoma, Arial;
}

#header{
width:750px;
margin-left:auto;
margin-right:auto;
background:url(header.jpg) no-repeat top left;
padding-top:112px;
}

#header ul{
color: #FFFFFF;
padding-left:438px;
}

#header li{
float:left;
list-style:none;
}

#header a:link,a:active,a:visited{
text-decoration: none;
color: #FFFFFF;
}

#header a:hover{
color:#000;
}

#t-accueil{
padding-right:54px;
}

#t-menu{
padding-right:46px;
}

#t-contenu{
padding-right:25px;
}

#recherche{
margin-left:500px;
color:#B41A00;
padding:32px 0px 22px 0px;
}

En conclusion :

le #header ul>li n'était pas interprété par IE ... pour ça que les liens étaient les uns en dessous des autres, IE ne voyait pas le display:inline.

En modifiant en #header li, cela fonctionnait MAIS j'ai choisi d'utiliser le float car IE 5 ne sait pas interprété display:inline et on en aurait été au même problème.

A toi de relever le défi de construire ton footer de la même manière

Bonne chance !

[nomasis]

J'ai vaincu la bête ! 

Yeah !

le #header ul>li n'était pas interprété par IE ... pour ça que les liens étaient les uns en dessous des autres, IE ne voyait pas le display:inline.

En modifiant en #header li, cela fonctionnait MAIS j'ai choisi d'utiliser le float car IE 5 ne sait pas interprété display:inline et on en aurait été au même problème.

Ah ! cochonnerie de IE !

Dans une interview récente au sujet de la sécurité de son browser, faite aux Etats Unis, Ben English, responsable sécurité des logiciels du premier éditeur mondial, explique que (je cite) :

"Internet Explorer est victime de la haine contre les américains et contre Microsoft. Le seul reproche qui peut lui être fait est d'être fourni avec Windows, mais il n'y a pas plus de failles dans le navigateur de Microsoft que dans d'autres navigateurs !"

Il faudrait lui sussurer qu'aussi passer son temps à "corriger" IE est contre productif et que ça lasse les webmasters qui du coup, recommande d'abandonner IE.

A toi de relever le défi de construire ton footer de la même manière

Bonne chance ! 

<{POST_SNAPBACK}>

Ça devrait aller sans trop de soucis. (peut être un peu présomptueux là ; on verra)

J'ai pas mal triché quand même pour arriver à avoir la bordure du bas dans IE ET dans FF : je l'ai suprrimé de l'image du header.jpg et je l'ai mis dans la CSS.

Du coup ça marche.

Dans la journée je vais t'écrire en PM.

encore MERCI. MERCI pour ton aide qui me fut si précieuse.