Problème d'affichage avec CSS

le texte disparait

Sujet résolu

19 avril 2006 à 23:13:47

Bonjour à tous.

J'ai un gros problème avec css. Ce problème n'apparait que sur IE (pas la peine de me dire qu'IE c'est nul) et malheuresement pour moi n'apparait pas tout le temps. Je dis malheuresement car je ne peux du coup pas faire des essais.

Mon problème est le suivant : le texte de ma page "disparait" (couleur invisible) et ne réapparait que si je sélectionne le texte ou si je fais défiler ma page UP/DOWN (je descent afin de cacher le texte puis je remonte).
Cela arrive généralement quand je déminiaturise la page, ou qu'une autre page apparait devant elle.(y'a un problème de "repaint" en fait).
Pour info j'utlilise une feuille css externe, je n'écris pas directement le code css dans mapage html.

J'espère que c'est un problème connu, dans le cas contraire je devrai me lancer dans une phase de test ultra-pénible (mais necessaire)

Merci d'avance pour tous ceux qui pourront m'aider!!!
Sylvain

streeter

19 avril 2006 à 23:17:52

tu peux poster ton code stp si c'est pas trop long.

JaJaKillaH

19 avril 2006 à 23:41:08

Est-ce que tu utilises Lycos comme hébergeur ? Je demande ça parce que je sais que le texte disparait (et n'apparaît parfois même pas du tout) à cause de leur pub impestive.

C'est peut-être un problème similaire.. Mais comme l'a dit Streeter ça serait cool que tu fasses voir ton code pour trouver le problème !

supers03

20 avril 2006 à 0:46:15

HO NOOOOON

ça fait 15 jours que j'ai ce problème (et que j'essai de le résoudre), et c'est le jour où je décide de poster ce message que je trouve la solution (enfin j'espère)

à priori c'est du à un <div> dans ma page, qui avait comme attribut "CLEAR:left;" ... un "clear" supprime seulement le dernier flottant ou tout les flottants de la page?

EDIT :
Désolé je ne savais pas qu'on ne pouvait pas poster deux messages à la suite.
Mon code light :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Page de Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<style>
BODY {
FONT-SIZE: 10pt;
MARGIN: 40px 100px 20px;
COLOR: #000000;
BACKGROUND-COLOR: #FFFFFF;
}
#sommaire {
FLOAT: left;
WIDTH: 100px
}
#contenu {
BORDER:#000000 1px solid;
PADDING-RIGHT: 20px;
PADDING-LEFT: 20px;
PADDING-BOTTOM: 20px;
MARGIN-LEFT: 130px;
PADDING-TOP: 20px;
BACKGROUND-COLOR: #AA0000
}
#carac {
FLOAT: left;
}
#graph {
CLEAR: left;
}
</style>
<body>
<div id="sommaire" >
Avec le premier float:left
</div>
<div id="contenu" >
<br /><br />
<img name="avatar" src="http://kaz9n.hp.infoseek.co.jp/works/bloodp/bloodp2.jpg">
Texte qui s'efface<br /><br />
<div id="carac">Ici y'a un autre float:left</div>
<div id="graph">Et ici y'a le clear:left</div>
<br /><br />
</div>

</body>
</html>

Le texte qui s'efface se trouve à droite de l'image.
J'ai remarqué que le bug part si on enleve la ligne "clear:left;" de #graph ou la ligne "BACKGROUND-COLOR: #AA0000" de #contenu

Vous pouvez tester le code sur les navigateurs IE

jp949

20 avril 2006 à 8:35:25

C'est parceque ton div contenu n'a pas le fameux "layout" : (concept imaginépar les developpeurs MS des années 90).
Pour lui donner ce fameux layout donne une hauteur fixe 100px sans importance puisqu'il etitre ton div contenu pour FF tu marques heiht:auto; dans ta regle css.
Poue IE tu places ca:
<head>

</head>

supers03

20 avril 2006 à 11:06:10

HA mince ça m'oblige à différencier IE de FF ... moi qui ne voulait pas le faire.

Bon en tout cas merci ça marche !!!