CSS - centrer Div taille aléatoire

Résolu
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...

6 réponses

  1. 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. 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
      1. 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...
        1. 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]-->
          1. 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 ! ;-)