Forum-webmaster
Technique - programmation => HTML / CSS / XHTML => Message commencé par: Sipher le le 09-01-2005 a 21:58:13

Titre: Float et <div> (Etirement)
Posté par: Sipher le le 09-01-2005 a 21:58:13

Bonjour, j'ai recemment décider de vouloir retaper tout mon site avec des layers (<div>) dans le but d'alleger le tout et suivre un peu plus les normes. Voila maintenant un probleme qui se presente a moi. Avec les tables nous pouvions faire suivre le design du site lorsque le contenu devenait trop long. ( En mettant un BG dans une cell de table ) Maintenant, avec les layers, quand le contenu est trop long, le texte s'affiche pardessus un autre layer et tout devient très laid.

Alors ma question est comme faire suivre les autres layers avec la grandeure ( height ) d'un autre layer. On m'a parler de float et j'ai fais une petite recherche mais j'ai rien capter.

Merci d'avance!

Titre: Re:Float et <div> (Etirement)
Posté par: solo le le 09-01-2005 a 23:20:01

salut, tu as des modèles ici :

http://www.alsacreations.com/articles/modeles/

Titre: Re:Float et <div> (Etirement)
Posté par: Sipher le le 10-01-2005 a 04:33:45


Code:
<body>
<div id="findcenter">
   <div id="Table_01">
      <div id="design-01_">
      </div>
      <div id="design-02_">
      </div>
      <div id="design-03_">
      </div>
      <div id="design-04_">
      </div>
      <div id="design-05_">
      </div>
      <div id="design-06_">
      </div>
      <div id="design-07_">
      </div>
      <div id="design-08_">
         <div id="content">
         </div>
      <div id="design-09_">
         <div id="copybox">
         </div>
      </div>
      </div>
   </div>
</div>
</body>
</html>


Code:
#findcenter {
position:absolute;
left:50%;
top:0px;
}

#Table_01 {
   position:absolute;
   left:-385px;
   width:770px;
   height:770px;
}

#design-01_ {
   position:absolute;
   left:0px;
   top:0px;
   width:253px;
   height:146px;
   background-image:url(../images/design-01.png)

}

#design-02_ {
   position:absolute;
   left:253px;
   top:0px;
   width:263px;
   height:146px;
   background-image:url(../images/design-02.png)

}

#design-03_ {
   position:absolute;
   left:516px;
   top:0px;
   width:253px;
   height:146px;
   background-image:url(../images/design-03.png)
}

#design-04_ {
   position:absolute;
   left:769px;
   top:0px;
   width:1px;
   height:146px;
   background-image:url(../images/design-04.png)
}

#design-05_ {
   position:absolute;
   left:0px;
   top:146px;
   width:770px;
   height:27px;
   background-image:url(../images/design-05.png)
}

#design-06_ {
   position:absolute;
   left:0px;
   top:173px;
   width:158px;
   height:597px;
   background-color:#631919
}

#design-07_ {
   position:absolute;
   left:158px;
   top:173px;
   width:612px;
   height:57px;
   background-image:url(../images/design-07.png)
}

#design-08_ {
   position:absolute;
   left:158px;
   top:230px;
   width:612px;
   height:438px;
   background-color:#1C3D41
}

#design-09_ {
   position:absolute;
   left:0px;
   top:438px;
   width:612px;
   height:102px;
   background-image:url(../images/design-09.png)
}

#content {
   position:absolute;
   left:11px;
   top:0px;
   width:592px;
   height:423px;
   z-index:1;
   overflow:auto
}

#copybox {
   position:absolute;
   left:6px;
   top:16px;
   width:481px;
   height:15px;
   z-index:1;
   text-align:right;
   font-weight: bold;
}

Je veux juste que la boite <div id="design-09_"> ( qui contient aussi COPYBOX ) descende lorsque <div id="content"> contient + de texte et qui doit alors allonger. J'ai essayer avec ce que m'a proposer et je comprend vraiment pas pourquoi ca ne fonctionne pas...

Merci

Titre: Re:Float et <div> (Etirement)
Posté par: jb_gfx le le 10-01-2005 a 14:18:05

Tu devrais poster un lien vers ta page parceque là c'est trés difficile de voir.

J'ai surtout l'impression que tu essais de passer des tableaux aux CSS sans changer ta méthode de conception. C'est une trés mauvaise façon de procéder, puisque :

1. ça ne t'apportera rien, tu vas juste te battre avec des tonnes de div et span pour essayer d'emuler le comportement des tables ce qui est à la fois inutile et quasi-impossible.

2. tu n'exploiteras pas les reel avantages de la composition en CSS que sont l'allegement du code, la simplicité de developpement, les possibilités de mise à jour, etc...


Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.