[Résolu] Image de fond et position

Bonjour,

J'aimerais savoir si il est possible de "bloquer" une image de fond quand on réduit une fenêtre (dès que le scroll horizontal apparaît) ?

Je m'explique :

Regardez cette exemple :

http://temp.pandela.ch

J'ai une image de fond qui fait genre 1800px de large, une div avec fond orange représente le contenu du site, si on fais apparaitre le scroll horizontal en réduisant la fenêtre, la "tête du type" va se cacher à gauche, on le voit plus...
J'aimerais que dès que le scroll apparait, le type reste à sa place comme quand y'a pas de scroll...
C'est possible de faire cela en css ?
J'avais penser à une solution en créant une div qui contient #site, qui fait la même taille et avec la même image de fond, mais ça fait un peu lourd niveau chargement de mettre plusieurs image de fond de cette taille...
Avez-vous une autre solution ?
De plus quand le scroll horizontal apparait, si on fait aller le scroll vers la droite, on vois qu'il y a du blanc, j'aimerais que l'image continue au lieu d'avoir du blanc...

Merci d'avance
Modifié par Blogger (20 Apr 2010 - 08:41)

Salut,

Tu as essayé avec un background-attachment:fixed ?

Salut,

Je viens d'essayer avec "background-attachment:fixed", le résultat est le même..rien ne change...

Mmh...

Supprime #fond et tout ce qui va avec, ajoute simplement ça :

body {
background: url("background.png") no-repeat fixed center top; }

J'ai testé sur ton site, ça fonctionne.

Avec ta méthode le blanc n'apparait plus mais le type part quand même à gauche quand tu réduit.
Je suis obliger de mettre le fond dans une div #fond parce après je vais le faire apparaître en fondu, que le fond, alors y me faut une div qui soit pas parent de #site...

Merci déjà pour ton aide

C'est marrant, on dirait un jeu de piste. Je dois deviner ce que tu veux faire ET te proposer une solution.

Bon, et ça ?

/*html, body { width: 100%; }*/

body {
position:relative;
min-width:900px; }

#fond {
position: absolute;
left:0;
top:0;
background: url("background.png") no-repeat center;
width:100%;
height:562px; }

Nice ça fonctionne, t'es un chef en CSS, c'est grâce au min-width dans le body ?

Non non c'est pas un jeu de piste, si tu voulais des précisions, faut demander.

Merci beaucoup BeliG