[résolu] Mauvaise position imgage de fond sous FF qd fenêtre réduite.

Bonjour

Je souhaite appliquer une image de fond à la balise Body pour donner une couleur différente "à l'extérieur" de la page, et aussi séparer les 2 colonnes du site par une ligne verticale de 1px.

Pour cela, j'ai créé une image haute de 1px (large de 1920px) que j'ai centrée et que je répète verticalement.

Mon problème est le suivant:

Sous IE (7), la ligne verticale qui sépare les 2 colonnes reste bien positionnée, que la page soit affichée en plein écran ou en fenêtre réduite.

Mais sous FF (3.5.3), dès que la taille de la fenêtre (réduite) devient inférieure à celle de la page (1008px), la ligne verticale qui sépare les 2 colonnes se décale vers la gauche et vient empiéter sur le contenu.

Voici un extrait du CSS:

body {
font-family: Lucida Grande, Arial, Helvetica, Sans-serif;
font-size: 0.8em;
text-align: left;
background:url(images/fond.png) repeat-y center 0;
color: #006699;
margin: 0;
}

#page {
margin: 0 auto 0 auto;
width: 1008px;
}

#content {
float: left;
width: 688px;
margin: 0;
padding: 0;
}

J'espère avoir été clair.

Merci de votre aide.

Stéphane
Modifié par StephaneLeChat (25 Oct 2009 - 17:32)

Salut,

C'est tout à fait normal qu'une image centrée se décale vers la gauche si cet espace réduit, et qu'elle ne soit plus au centre d'un contenu centré sur une largeur supérieure.

Il vaudrait mieux que tu utilise ton image en fond centrée de ton conteneur, et non de body, ce qui permettrait qu'elle soit toujours centrée par rapport à ces 1008px de large.

Bonjour Mikachu

Merci de ta réponse. C'est effectivement ce qu'il faut faire.

Et pour donner une couleur différente "à l'extérieur" de la page, j'ai déclaré une couleur de fond pour la balise Body, et effectivement, maintenant, le comportement est celui que j'attendais

Encore Merci.