Bug sous Firefox: couleur background disparaît

White-Storm · 31 Janvier 2007

Bonjour, j'ai un gros souci avec une page de test que j'ai créée.
J'ai un fond de couleur #770000 pour mon body, j'ai un div pour conteni le site, qui lui a un fond blanc, et une image de fond (png) également. problème: lorsque je scroll la page, la couleur de fond du body apparaît sur la gauche en remplaçant la couleur de fond du div (le blanc quoi). :ouch:

J'ai déja vu ce bug une fois, mais aucune idée comment le résoudre. Je pourrais bien sûr mettre directement l'image avec un fond blanc mais bon je trouve pas normal... :sweat:

Voici mon code:

HTML:
[cpp]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<link href="wid.css" rel="stylesheet" type="text/css" />
</head>
<style type="text/css">
*{
margin:0;
}
</style>
<body style="margin: 0px; background-color:#770000">
<div id="sitebase">
<div id="header"></div>
</div>
</body>
</html>
[/cpp]

CSS:
[cpp]

#sitebase {
background-color: #FFFFFF;
width: 900px;
height: 1000px;
position: absolute;
left: 50%;
margin-left: -455px;
border: 5px solid;
background-image:url(mainborder-top-left-right.png);
background-repeat: no-repeat;
background-position: center top;
}

#header {
background-image: url(header750x200.jpg);
position: relative;
left: 50%;
margin-left: -375px;
margin-bottom: 200px;
top: 110px;
height: 200px;
width: 750px;
}

[/cpp]

Ce serait gentil de m'expliquer pourquoi il fait ça :/
voici l'adresse:

Vous devez être connecté pour voir les liens.

ah ben désolé mais maintenant il affiche même plus l'image :sweat:
bon j'en ai eu marre, j'ai mis une image unique en fond, mais si quelqu'un sait pourquoi ça m'a fait ça, qu'il n'hésite pas

Johan_et_Pirlouit · 31 Janvier 2007

xx-lastardu71210-xx :

Si, il l'affiche, mais c'est long à charger : le serveur de ton hébergement rame......

A part ça, rien ne permet de mettre en évidence ton pb de scroll [:spamafote].. En l'état, je ne vois pas ce qui "coince"..

Peut-être que tu as un pb de centrage lorsque la fenêtre devient moins large que ton <div>. Pour corriger, essaie ceci :
[cpp]#sitebase {
position: relative; // Pas de position: absolute dans ton cas ! Si tu dois mettre un conteneur après, tu ne pourras pas le placer correctement et utiliser pleinement la hauteur de l'écran de ton visiteur.
margin: 0 auto; // marges latérales automatiques, donc centrage du conteneur dans son contenant.
}[/cpp]
D'ailleurs, ne bride pas la hauteur de ton <div> principal à la hauteur d'un timbre poste !! Sur mon 19" CRT en 1280x960, ton site apparait ridicule.. Et c'est dommage

..

Sinon, pense plutôt ton XHTML en DOCTYPE Strict : 1.0 ou 1.1. Ca t'évitera de laisser passer des attributs HTML désormais totalement obsolètes..

Et pour le jeu de caractères, si tu veux conserver le jeu Occidental, utilise le "iso-8859-15" : il prend en compte l'€ et les Œ et œ précédemment oubliés

.. Mais si tu peux, essaie l'Unicode "utf-8" : il n'est pas non plus parfait, mais parmi les avantages il y a celui de ne plus du tout utiliser les caractères HTML spéciaux pour les lettres accentuées, ces lettres qui peuvent parfois poser des soucis dans les autres langues..

:merci:

Bug sous Firefox: couleur background disparaît

White-Storm

Johan_et_Pirlouit