Menu fixe - contenu passe sous menu après clic sur lien Fermé

Question

Bonjour, 

J'ai en haut de page un menu fixe :

#fixe {
	position: fixed;
	top: 0px;
}

En dessous le contenu est dans une div, à laquelle j'ai appliqué un margin-top de la taille du menu.

Les liens du menu pointent vers des ancres répartie dans la div de contenu.

Quand je clique sur un lien du menu, le contenu, au lieu de s'afficher après le margin-top de la div (donc après le menu), s'affiche tout en haut de la page, donc sous le menu.

Comment faire pour que le contenu s'affiche sous le menu ?
Pourquoi le margin-top de la div n'est plus respecté après clic sur un lien du menu?

Je ne peux pas utiliser de javascript, tout doit rester html et css.
J'espère avoir été suffisamment clair.

Merci pour votre aide
Configuration: Windows 7 / Chrome 32.0.1700.76 
 
--

deadmix · Answer

est ce que tu peux afficher ton code html ou donner un lien ou en peux voir ce qui se passe !!?

Granulet · Answer

#page {
	color: #000000;
	background: #ffffff;
	width: 653px;
	margin: 0 auto;
}
#fixe {
	position: fixed;
	top: 0px;
}
#vert {
	position: absolute;
	margin-top: 210px;
	width: 653px;
	height: 104px;
	background: #61bc47;
	-moz-opacity: 0.9;
	opacity: 0.9;
	filter: alpha(opacity=90);
}
#menu {
	margin-top: -8px;
}
#contenu {
	margin-top: 358px;
}
#haut {
	position: fixed;
	right: 0px;
	margin-top: 100px;
}

Page : page entière, qui permet de faire une marge par rapport au body
Fixe : bannière fixe en haut de page
Vert : bandeau sur la banniere
Menu : menu fixe sous la bannière. Il appelle des ancres dans la div contenu.
haut : contient la bannière, le bandeau et le menu.
Contenu : c'est la div qui contient le texte. Elle a margin-top de 358px.

Quand je clique sur le menu, il appelle une ancre de la div contenu, et au lieu de l'afficher à un margin-top de 358px comme je le voudrai (margin top de la div contenu), il l'affiche tout en haut de page, sous le menu fixe.

Est ce plus clair?

Granulet · Answer

Je me suis trompé, la div haut n'interveint pas dans ce problème, elle est utilisée plus loin.
Donc:

#page { 
color: #000000; 
background: #ffffff; 
width: 653px; 
margin: 0 auto; 
} 
#fixe { 
position: fixed; 
top: 0px; 
} 
#vert { 
position: absolute; 
margin-top: 210px; 
width: 653px; 
height: 104px; 
background: #61bc47; 
-moz-opacity: 0.9; 
opacity: 0.9; 
filter: alpha(opacity=90); 
} 
#menu { 
margin-top: -8px; 
} 
#contenu { 
margin-top: 358px; 
}

Page : page entière, qui permet de faire une marge par rapport au body 
Fixe : bannière fixe en haut de page 
Vert : bandeau sur la banniere 
Menu : menu fixe sous la bannière. Il appelle des ancres dans la div contenu. 
Contenu : c'est la div qui contient le texte. Elle a margin-top de 358px. 
 
Peut être qu'il est possible en html,  de préciser sur un lien la hauteur dans la page à laquelle on veut que s'affiche que le contenu ?
C'est pour cette raison que j'utilise des ancres, mais ça ne fonctionne pas dans ce cas.

Menu fixe - contenu passe sous menu après clic sur lien

3 réponses

Discussions similaires