Colonnes Fléxibles

djo77380
Nouveau WRInaute
Nouveau WRInaute
 
Messages: 2
Inscription: 26 Oct 2008

Colonnes Fléxibles

Message le Dim Oct 26, 2008 17:28

Tout d'abord bonjour à tous! J'espère que vous pourrez m'aider! Je précise je débute lol
Je vais pas y aller par quatre chemin voici un aperçu de mon design:

Image

De chaque coté du "corps" se trouve une colonne (noire avec les effets marrons). J'aimerais que ces colonnes soient de la même longueur que le "corps" et donc extensibles en fonction de la taille du "corps" (selon la quantité de textes).
J'ai essayer de créer une div enveloppant le corps et les 2 colonnes mais rien n'y fait ça ne fonctionne pas :(
Merci d'avance!


CODE HTML
Code: Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Site Perso</title>
       <meta http-equiv="Content-Type" content="text/html; charset= Unicode (UTF-8)"" />
       <link rel="stylesheet" media="screen" type="text/css" title="Exemple" href="design.css" />
   </head>

   <body>
   <map name="Map" id="Map">
  <area shape="rect" coords="209,-1,315,24" href="index.html" />
<area shape="rect" coords="333,1,370,21" href="cv.html" />
<area shape="rect" coords="489,-2,563,18" href="contact.html" />
</map>
     
       <div id="en_tete">
           <?php include("banner.php"); ?>       
       </div>
        <div id="colgauche">         
       </div>
        <div id="coldroite">           
       </div>
       <div id="corps">
       <p><center>Bienvenue sur mon site!!!!</center></p>
                     .......

       </div>
      
       
       <div id="pied_de_page">
       
           <p><br/><br/><center>Copyright "" 2008, tous droits réservés</center></p>
       </div>
      <?php include("bas.php"); ?>
</div>
   </body>
</html>


CODE CSS
Code: Tout sélectionner
body
{
   width: 800px;
   margin:0 auto; /* Pour centrer notre page */
   margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d'enlever pour voir ! */
   margin-bottom: 20px;    /* Idem pour le bas du navigateur */
   background-image: url("http://forums.macgeneration.com/images/fond.png"); /* Une petite image de fond pour éviter d'avoir un vieux fond blanc :p */
   background-color: #000000;
}



#banmenu { ---> (bannière appelée par l'include)
   margin: -6px;
   background-color: #000000;
   padding:0px;
   margin-left:0px;
}


#colgauche {
   background-image: url("http://forums.macgeneration.com/images/barleft.jpg");
   float : left;
      width : 200px;
}

#coldroite {
   background-image: url("http://forums.macgeneration.com/images/barright.jpg");
   width: 79px;
   height: 100px;
   float: right;

}


#corps {
   background-color:;
   border: 0px;
    color: #FFFFFF;
   background-image:url("http://forums.macgeneration.com/images/fond.jpg");
   margin-left:79px;
   width:600px;
   padding:20px;
   font: Arial;
   font-size: 13px;
}

#pied_de_page {
   color: #FFFFFF;
   background-image:url("http://forums.macgeneration.com/images/foot.jpg");
   margin-left:79px;
   width:600px;
   padding:20px;
   font-size: 12px;
}
#bas {
   margin-left:79px;
   width:642px;
   height:70px;
   
}

Rod la Kox
WRInaute accro
WRInaute accro
 
Messages: 3253
Inscription: 24 Juin 2008

Message le Dim Oct 26, 2008 17:55


djo77380
Nouveau WRInaute
Nouveau WRInaute
 
Messages: 2
Inscription: 26 Oct 2008

Message le Dim Oct 26, 2008 18:01

Rod la Kox a écrit:http://css.alsacreations.com/Modeles-de-mise-en-page-en-CSS
;-)


J'ai déjà essayé ça ne fonctionne pas :(

Rod la Kox
WRInaute accro
WRInaute accro
 
Messages: 3253
Inscription: 24 Juin 2008

Message le Dim Oct 26, 2008 18:02

Bah si, ça fonctionne, mais faut peut-être refaire tout ton squelette. ;-)


Si vous avez aimé cette discussion, partagez-la sur vos réseaux sociaux préférés :

Lectures recommandées sur ce thème :



Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 1 invité