Discussion :

[symff]

Bonjour

J'aimerais "fixer" un de mes div dans l'affichage de ma page pour qu'il soit toujours visible même si l'utilisateur descend...

J'ai trouvé sur internet: position:fixed; mais apparement ça marche pas sur tous les navigateurs et c'est vrai que j'ai essayer et ... ça marche pas !

Code :

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

1
2
3
4
5
6
7
8
9
10
<div id="utility">
	[...]
</div>		
 
<div id="content">   
        [...]
	<div id="footer">
               [...]
	</div>
</div>

Je voudrais que mon div "utility" ne bouge pas. Quelqu'un peut m'aider svp?

[Michelk12]

Bonjour,

As-tu tenter avec

Code :

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

position:absolute;

?

En précisant left et top?

Michel

[badajoz]

Salut,

Essaye ce code CSS pour ton div:

Code :

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

1
2
3
4
5
6
7
 
div#utility {
	position: fixed;
	top: 0px;
	left: 0px;
        z-index: 100;
}

[psykoz]

Bonjour

Voici un petit exemple :

Code HTML :

Code :

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

1
2
3
4
5
<div id="menu">
Votre Menu
<a title="votre titre" href="#">Mozilla</a>
<a title="votre titre" href="#">Opera</a>
</div>

Code CSS:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
#menu {
border:1px solid #888888;
color:#FFFFFF;
display:block;
left:170px;
padding:10px;
position:fixed;
text-align:center;
top:10px;
width:130px;
}

[Invité]

il est vrait que ie 6 ne supporte pas la position fixed et peut etre aussi ie 7 la seule solution c'est le javascript

Code :

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

document.getElementById('monelement').style.top=document.getElementById('monelement').offsetTop+document.body.scrolltop

a utiliser avec l'evenement onscroll

[psykoz]

Pour l'exemple que j'ai cité dans ma réponse sa marche même pour ie6, vous n'avez plus besoin de javascript

[badajoz]

Je confirme également que le code css que j'ai mis fonctionne sur ie6 & ie7.

[symff]

Désolée pour la réponse si tardive ! Merci beaucoup pour vos réponses
Ca marche très bien =D