28172 sujets

CSS et mise en forme, CSS3

Bonjour j'essaie de positionner des blocs mais mon bloc centrale decale mon bloc de droite.


 <!-- CONTENT -->
 <div id="content">
     <!-- CENTRALE -->
     <div id="centrale">
     </div>
     <!-- MENU DROITE -->
    <div id="menu_droite">
       <ul>
           <li><a href="">Accueil</a></li>
           <li><a href="">Mes messages</a></li>
       </ul>    
     </div>
</div>



/* CONTENT */

#content{
width:940px;
}

/* CENTRALE */

#centrale{
width:705px;
position:relative; /* CODE QUI DECALE MON BLOC DROITE VERS LE BAS */
}

/* MENU DROITE */

#menu_droite{
width:206px;
position:relative;
left:734px; /*940-206*/
}

Modifié par poseiidon (24 Mar 2009 - 10:30)
Salut,

Tu devrais plutôt utiliser les blocs flottants pour faire ce que tu souhaites :

<div id="content">
   <div id="navigation"></div> 
   <div id="centrale"></div>
</div>


#content{
width:940px;
}

#centrale{
width:705px;
float:left;
}

#navigation{
width:206px;
float:right;
}
Du coup je reouvre le sujet parceque le bloc titre qui fais décaler le bloc droite comme si le width définit continuer sa course jusqu'au dessus du bloc droite qui créer une marge egale à sa hauteur.


<div id="content">   
   <div id="titre"></div>
   <div id="centrale"></div>
   <div id="navigation"></div> 
</div>

#content{
width:940px;
}

/* TITRE */

#titre{
width:705px;
float:left;
}

/* CENTRALE */

#centrale{
width:705px;
float:left;
}

/* MENU DROITE */

#navigation{
width:206px;
float:right;
}


Modifié par poseiidon (24 Mar 2009 - 10:36)