Discussion :

[darcy]

Bonjour,

Voilà j'ai un soucis d'incompatiblité entre les deux navigateurs Firefox et Internet Explorer.
Dans le body, j'ai placé une image en Backround et en top.
Sous firefox, l'image est parfaitement positionnée mais sous IE.
L'image est décalée sur la droite...
Je ne comprends pas pourquoi...
Et une autre chose où le problème est rencontrée également :

Le body est déclarée à 100% mais si je le mets par exemple à 90% et que je place un border de 10px, mon image en backround dans le body sort alors du cadre border (décalée encore) et comme mon menu qui est aussi alors décalée
Je n'arrive pas à comprendre pourquoi, si quelqu'un a une idée..
Merci beaucoup
Je vous met mon code css.
En espérant que je me suis fait bien comprendre

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
#en-tete 
	{
 
	position:relative;
	height: none;
	background-image:url(images/essaiban1.jpg);
	padding: 30px;
	background-repeat:no-repeat;
	background-position:center;	
 
	}
 
body 
	{
 
font-size:small;
width:100%;
margin:0px;
background-image:url(images/beauce12.jpg);
background-position:top;
background-repeat:no-repeat; /* c'est cette image qui se retrouve décalée */
padding:10px;
border: 10px solid black;
	}

[Bisûnûrs]

C'est normal, tu utilises pour l'en-tête :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

background-position:center;

Si tu ne renseignes pas x et y alors il applique le position aux deux.
Ce que tu as écris est l'équivalent de :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
background-position-x:center;
background-position-y:center;

Pareil pour ton body, tu écris :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

background-position:top;

Ce qui revient au même que d'écrire :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
background-position-x:top;
background-position-y:top;

Et là, ça ne veut plus rien dire ...
Donc sur IE, il zappe la déclaration :

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

background-position-x:top;

qui ne signifie rien et met donc la valeur par défaut : center.

Code CSS :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
body{
   background-position:top left;
}

[darcy]

Génial

Merci Bisûnûrs ! ! !

Une dernière chose à propos de ce soucis, mon border avec 10 px se voit très bien dans le navigateur à gauche, mais à droite, il semble sortir du cadre et on le ne le voit pas.
Est ce que c'est parce que j'ai indiqué un body à 100 %?
car en effet, même en mettant 90% au body, l'image backround sort quand même du border à droite...(le body aussi)

Merci

[Bisûnûrs]

Ca, tout dépend de ton navigateur ..

Sur IE, le cadre est dans le conteneur et sur Firefox à l'exétérieur.

Par exemple, si tu donnes 100px de large à ton conteneur avec une bordure de 10px, sur IE taille totale=100px, sur Firefox taille totale=120px.

Dans le cas où tu mets une bordure à ton body qui vaut 100%, on ne verra forcément pas un bout du body ni la bordure droite ...

[darcy]

C'est résolu presque