CSS - centrer Div taille aléatoire [Résolu/Fermé]

Signaler
Messages postés
139
Date d'inscription
jeudi 12 février 2009
Statut
Membre
Dernière intervention
16 février 2012
 -
Messages postés
3019
Date d'inscription
samedi 13 janvier 2007
Statut
Membre
Dernière intervention
19 juin 2013
 -
Bonjour,

voila un problème ce pose... comment centrer une div quand on ne connait pas à l'avance sa taille. (la div contient un menu dont la taille diffère selon le type de l'utilisateur qui se connecte (administrateur, simple utilisateur...)
si quelqu'un a une idée...


Afficher la suite

6 réponses

Réponse 1 / 6
Messages postés
3019
Date d'inscription
samedi 13 janvier 2007
Statut
Membre
Dernière intervention
19 juin 2013
 121
Salut,

Soit la solution de magicshark, ou alors...
Supposons que tu aies ceci : 

<div id="menu_contenant">
	<div id="menu">
		...
	</div>
</div>

Tu peux donner un CSS qui ressemble à : 

#menu_contenant {
width:400px;
}

#menu_contenant #menu {
margin:0 auto;
width:200px;
}


En gros, la clé c'est le margin:0 auto; qui fait un positionnement centré. Dans certains cas, un text-align:center; sur le #menu_contenant peut aider aussi, mais c'est secondaire.

Après, le #menu peut avoir la largeur qu'il veut, tant que ça n'excède pas celle du contenant.

J'espère que ça t'aide !
1
Merci
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 63550 internautes nous ont dit merci ce mois-ci

Réponse 2 / 6
Messages postés
399
Date d'inscription
mardi 27 juillet 2010
Statut
Membre
Dernière intervention
6 mai 2014
 16
je vois bien une solution mais c'est pas la meilleur suremant faire des div dynamique qui s'appelle soit user,admin ... et faire les taille en css
Réponse 3 / 6
Messages postés
139
Date d'inscription
jeudi 12 février 2009
Statut
Membre
Dernière intervention
16 février 2012
 3
Bon j'ai trouvé une "feinte" à mon problème qui fonctionne sous Chrome et Firefox mais pas sous IE :s ... 


<?php 
if(verifAccesAdmin($_SESSION['idUnique']) || verifAccesCadre($_SESSION['idUnique'])){
?>
<body onload="javascript:document.getElementById('menu').style.marginLeft='-109px';" />
<?php 
}else{
?>
<body onload="javascript:document.getElementById('menu').style.marginLeft='-42px';" />
<?php }?>


Si quelqu'un a une idée...
Réponse 4 / 6
Messages postés
139
Date d'inscription
jeudi 12 février 2009
Statut
Membre
Dernière intervention
16 février 2012
 3
Problème résolu !!!
ajout dans css du body 

 text-align: center;

et
ajout de par exemple pour que ceci s'éxécute uniquement ac IE 

<!--[if IE]>
<body onload="javascript:document.getElementById('menu').style.marginLeft='-312px';" />
<![endif]-->
Signaler
Messages postés
3019
Date d'inscription
samedi 13 janvier 2007
Statut
Membre
Dernière intervention
19 juin 2013
 121
Ouais... Moi je te conseillerais d'utiliser un attribut style="..." dans la balise au lieu de recourir au Javascript. Ne serait-ce que parce qu'il y a quand même un bon nombre d'utilisateurs qui désactivent carrément Javascript sur leurs navigateurs, se croyant ainsi plus en sécurité... Et personnellement je déteste à mourir la fonction onload(), ça me donne de l'urticaire et je ne m'en sers qu'en dernier recours...

Ultimement c'est ton choix ! ;-)
Réponse 5 / 6

Demande à Falcon le bouvier bernois!
Réponse 6 / 6

Ouai il est cool Falcon je le connais
Posez votre question