28172 sujets

CSS et mise en forme, CSS3

Bonjour,
je souhaite avoir un menu fixe qui ne bouge pas, je l'ai mis dans un conteneur :

#Conteneur{
	position: relative;
	width: 900px; 
	margin: auto;
}
#Menu{ 
	position: fixed;
	z-index: 1000; 
	right: 0; 
	top: 0;
}


Au lieu de rester dans le Conteneur, le Menu déborde complètement, et va à l'extrémité de l'écran à droite
Modifié par smith (30 May 2013 - 14:10)
Bonjour,

Je ne suis pas sûr de comprendre ce que tu veux dire par "fixe", est-ce le fait qu'il reste en haut de la fenêtre même quand on défile ? Ou peut-être qu'il reste fixe au niveau des dimensions ?
c'est ça que je cherchais
http://jsfiddle.net/Pd3bs/5

merci pour le coup de main Smiley biggrin
Modifié par smith (30 May 2013 - 14:43)
6l20 a écrit :
À vos rangs, fixe ! (lien (inside) à suivre Smiley cligne

c'était rapide car c'est un peu complexe tout ça

c'est ce que j'ai fait au début, mais j'ai laissé tomber le
right:0

car dans ton exemple, comme dans mon cas, #fixe déborde et sort de #wrapper, et ce n'est ce que je veux, je cherchais une solution pour le coller #fixe aux extrémités de #wrapper sans forcément mettre des margin-right ou margin-left

comme sur ton exemple édité :
http://jsfiddle.net/dUrf7/2/
Modifié par smith (30 May 2013 - 15:00)
Par fixe, tu entendais positionné, ce qui a semé le "trouble" Smiley cligne

Comme tu as pu le lire sur le site openweb (que j'ai mis en lien dans mon exemple) le comportement des positionnements fixe (fixed) et absolu (absolute) diffère quelque peu.
Si tu voulais effectivement un positionnement précis dans ton conteneur (sans que celui-ci reste affiché même s'il y a un déplacement dans la fenêtre, alors le positionnement absolu convient, dans le cas contraire (positionnement fixed) le référant change et il est difficilement possible de contraindre ce bloc à "rester" dans le conteneur (tout du moins, à tenter de le faire croire...)
Bonjour bonjour !

Je me permets de reprendre ce post car j'ai un problème sur le même sujet.
Je veux créer un menu fixe sur la gauche (donc qui reste au même endroit même lors du scroll).
Sur Chrome, Mozilla, et d'autres navigateurs sur smartphone tout fonctionne bien mais ... IE fait sa tête de mule et ne fait pas comme les autres...

J'ai regardé sur des dizaines et des dizaines de sites / forums pour comprendre mon problème, sans succès, même avec vos exemples (V'la mon état après des heures de recherche > Smiley biggol ).

Pourriez vous me donner un indice ?

Mon code :
#menu
{
	float:left;
	position: absolute; /* menu ne bouge pas pour IE */
	left:0.5em; /* colle quasi tout a gauche et en haut */
	list-style-type:none; /* On enlève la puce */
	margin: 0; /* On retire les marges intérieures et extérieures */
	height:96%; /* Hauteur du menu */
	width:  8em	;  /* On met une largeur pour ne pas prendre toute la largeur de l'écran */
	border : solid 1px #004E87;  /* On applique des bordures à la balise ul */
	background-color:#D6D6D6; 
	font-size:25px;	
}
*>#menu  /* menu fixe, laisser en dessous de #menu car IE fait n'importe quoi */
{
	position: fixed
}  


Bonne journée à tous et un GRAND merci à celui qui prendra la peine de m'aider Smiley smile
AAAAAAAAAAAAAAAH Je vous promets que ça fait des heures et des heures que je me tâte à me faire aider via un forum, et suffit que je le fasse pour que j'aie LA révélation Smiley wingol

Je faisais un require_once(menu.html) en dehors du body ... Maintenant que je l'ai mis à l'intérieur tout fonctionne à merveille ... (j'ai un tabouret et une corde neufs à vendre, pas eu besoin de les utiliser).

Bref, désolé pour le dérangement, j'ai pas réussi à delete mon post du dessus Smiley sweatdrop

(Re)Bonne journée à tous Smiley jap

edit: j'ai encore eu un problème, résolu par
<meta http-equiv="X-UA-Compatible" content="IE=9" />
si ça peut aider ...
Modifié par pinguu (14 Jun 2013 - 12:01)