28173 sujets

CSS et mise en forme, CSS3

PB Fixer un background avec Firefox

Bonjour à tous,

j'ai un souci quand je réduis la fenêtre du navigateur sous Firefox le background vire sur la gauche sous IE c'est ok!


AVEC FF 2 le background bouge quand je réduis la fenêtre.
http://www.chambres-linthal.com/test/FIREFOX2.jpg

AVEC IE le background ne bouge pas
http://www.chambres-linthal.com/test/IE.jpg

voici mon code css :
<style type="text/css">
<!--
body {
	background:#FFFFFF url(bg.jpg) repeat-x;
	font: normal 80%/1em "Trebuchet MS", Verdana, Arial, sans-serif;
	color: black;
	margin: 0;
	padding: 0 0 2em 0;
	text-align: center;
}

#home {
background: url(fond.jpg) no-repeat 50% 0px;
}

#header {
border:2px solid pink;
}

#wrapper {
position:relative;
width:920px;
height:500px;
margin: 0 auto;
border:2px solid pink;
}


div#left {
   width: 200px;
   position:absolute;
   top:0;
   left:0; 
   border:1px solid green;
}

div#right {
   width: 190px;
   position:absolute;
   top:0;
   left:730px; 
   border:1px solid green;
}

div#middle {
   width: 510px;
   position:absolute;
   top:0;
   left:210px; 
   border:3px solid red;
   text-align:left;
 }
 
div#lienbas {
   width: 550px;
   position:absolute;
   top:0;
   left:210px; 
   border:3px solid red;
 }

-->
</style>



Voici l'url de test :
Page de demo

une idée?

merci à tous
Modifié par koestel (14 Dec 2006 - 14:10)
Vit fait, il me semble que ton background (si j'ai bien pigé ce que tu appelles background), ne bouge pas....

Je dirais plutot que c'est la largeur de tes conteneurs left, center et right qui change...
Ah si ca y est je l'ai , tu n'a qu'une image de fond pour l'ensemble de ton site , centrée au milieu de ta fenêtre et c'est ca qui fait le fond de tes différents conteneurs.

Le souci c'est que comme des conteneurs sont positionnés ( absolute ) et 0 fixés à de Top et de Left, evidemment eux restent scotchés au bord de la fenêtre et du a un décalage quand tu rapetisse.

Pour règler ca , si tu veux que ton site soit adaptable il te faut avoir soit un conteneur qui contient l'ensemble de la page et dont le fond est ton image, soit affecter une image de fond a chacun de tes blocs, pour que quand ceux ci bougent , leurs background resepectifs restent en place.
j'ai un conteneur wrapper je essayer de bricoler ca..


#wrapper {
position:relative;
width:920px;
height:500px;
margin: 0 auto;
border:2px solid pink;
}


merci beaucoup.
a propos tu aurais pas une solution pour rendre le pied de page dynamique en fonction de la hauteur du texte?
salut,


Si j ai bien compris ta question...
un petit clear:both dans ton pied de page, devrait le ramener à la hauteur du contenu précédant
Sujet clos
Aller à