Centrer une <div> en position fixe sous IE

**Jorus** · 23/09/2004, 14h25

Salut,

Voilà, je voudrais centrer mon image fixed (pas absolute) en fond d'écran sous ie. J'ai déjà fait une recherche mais sans succès. J'ai déjà vu une page qui parlait d'un bug sous ie avec lequel il faudrait tricher mais je ne trouve plus cette page.

Donc ca marche très bien avec mozilla mais pas ie.

Voilà le code existant.
test.html :

Code :

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
25
26
27
28
29
30
31
32
33
34
<html>
<body>
 
	<link rel="stylesheet" type="text/css" href="test.css" media="screen" />
 
	<div style="position:fixed;z-index:0" id="test">
     		<img src="test.jpg"/>
	</div>
 
	<div style="position:absolute;z-index:1">
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>blublu<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
		toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>toto<br>
	</div>
 
</body>
</html>

le test.css :

Code :

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
img
{
	opacity: 0.2;
	filter: alpha(opacity=20);
	-moz-opacity: .2; 
}
 
#test
{
    top:50%; 
    left:50%; 
    margin-left: -141px; 
    margin-top: -106px; 
    width:283px; 
    height:212px; 
    padding:0px; 
}
 
div
{
	text-align: center;
}

Merci d'avance
@+
Jorus

**vorador** · 23/09/2004, 15h44

euh ce que tu veux c'est avoir un fond d'ecran qui bouge pas quand tu fait un scroll?

si j'ai bien compris i suffit de mettre ca :

Code :

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

background-attachment : fixed;

dans ton css

**Jorus** · 23/09/2004, 15h50

oui mais comment je peux centrer mon image ?

@+ et merci
Jorus

**vorador** · 23/09/2004, 15h53

Code :

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

1
2
3
4
{text-align : center; 
display : block; 
margin-left : auto;
 margin-right : auto;}

je pense que ca marche

bonne chance

**Jorus** · 23/09/2004, 15h59

Envoyé par vorador

Code :

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

1
2
3
4
{text-align : center; 
display : block; 
margin-left : auto;
 margin-right : auto;}

je pense que ca marche

bonne chance

Merci,

j'ai même trouver ca :

Code :

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

1
2
3
4
5
6
7
8
body
{
        background-image: url(test.jpg);
	background-attachment: fixed;
	background-position: center center;
	background-repeat: no-repeat;
 
}

mais dans ce cas, comment modifier l'opacité ?
parce qu'avant je faisais ca avec ma balise <img> :

Code :

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

1
2
3
4
5
6
img
{
   opacity: 0.2;
   filter: alpha(opacity=20);
   -moz-opacity: .2;
}

@+
Jorus

**vorador** · 23/09/2004, 16h13

{
background-image: url(test.jpg);
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
Filter: Alpha(Opacity=20);
}

tu as testé ca?
sinon je sais pas si on peut gerer l'opacité du background.

tu peux aller voir la c'est complet comme doc

http://dicolive.media-box.net/docCSS...ByType=1&id=57

**Jorus** · 23/09/2004, 16h18

Je viens de tester et ca marche sous ie mais plus sous Mozilla.

Mais c'est pas grave puisque j'ai une solution qui marche sous Mozilla. Je vais détecter la version du navigateur et utiliser le css qui convient.

Merci de m'avoir donné la solution.
@+
jorus

**vorador** · 23/09/2004, 16h27

de rien

. n'oublie pas le bouton résolu, en bas, pour dire que la solution à ton problème à été trouvée.

**Jorus** · 23/09/2004, 16h29

Ah oui, j'ai du mal à m'y faire à ce bouton mais ca vient, ca vient...

@+
jorus

Centrer une <div> en position fixe sous IE

Centrer un élément en CSS

Discussions similaires

Partager

Partager