Cellule extenssibles

Résolu/Fermé
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 - 2 juin 2008 à 09:29
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 - 3 juin 2008 à 19:12
Bonjour,

J'aimerais savoir comment créer un tableau extensible. Je m'explique : J'ai crée un site (encore en bêta test), en tableau. En gros il y a l'image du haut, le menu horizontal, le menu de gauche, le corps, et la bande du bas. Seulement voila : Le corps est extensible ! Si j'écrit beaucoup dans le corps, il s'agrandit... mais pas le cellule ! Ce qui fait que je me retrouve avec un corps dépassant la bande du bas !!!

Comment faire en sorte que la cellule grandisse en même temps que le corps ??? J'ai essayé en %, mais ça ne marche pas...

Pour vous aider, voici le code source de la page :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<?php include ('include/head.html'); ?>
<body>
<table style="width: 100%; text-align: left; margin-left: auto; margin-right: auto;" border="0" cellpadding="2" cellspacing="2">
  <tbody>
    <tr align="center">
      <td colspan="2" rowspan="1" height="100"><div class="element_logo" id="logo"><br /><a href="/"><img src="images/entete.gif" height="70" width="807"></a></div></td>
    </tr>
    <tr align="center">
      <td colspan="2" rowspan="1"><div id="menu_h"><?php include ('include/menu_h.html'); ?></div>
</td>
    </tr>
    <tr>
      <td style="width: 20%;text-align: center;"><div class="element_menu_g" id="menu_g"><?php include ('include/menu_g.html'); ?></div>
</td>
      <td style="width: 80%;">
	  <div id="corps">
<div id="titre_bloc" class="element_menu_g" ><bg>.:&nbsp;Titre de la page...</bg></div>
//Texte du corps...
//Blablablabla...
	  </div>
</td>
    </tr>
    <tr align="center">
      <td colspan="2" rowspan="1"><div class="element_copyright" id="copyright">
  <?php include ('include/bas.html'); ?>
</div>
</td>
    </tr>
  </tbody>
</table>
</body>
</html>


Et celui du CSS :

/* Mises en page générales */

body{
 height: auto;
 width: auto;
 background-image:url(images/back-body.jpg);
 font-family: Helvetica, Tahoma, Arial, Verdana, sans-serif;
 font-size: 12px;
 color: #FFFFFF;
}	

#logo{
 font-size: 8px;
 height: 100%;
 width: 100%;
 border: #000000;
 background-color: black;
}
.element_logo a{
 color: #000000;
}
.element_logo a:hover{
 color: #000000;
}

#menu_h{
 height: 27px;
 width: 100%;
 margin-top: 20px;
 background-image: url(../images/font-menu_h.jpg);
 background-repeat: -x;"
}

#menu_g{
 float:left;
 width: 195px;
 margin-top: 10px;
 background-color: #444444;
 border: 1px solid #666666;
 height:auto;
 min-height: 100px;
 margin-bottom: 10px;
}

#titre_bloc{
 padding-top: 2px;
 height: 25px;
 background-image: url(images/fond-titre-cellules.png);
}
.element_menu_g bg{
 color: #FF9900;
 font-size: 15px;
 font-weight: bold;
 padding-left: 5px;
 }


#corps{
 float: left;
 top: 28%;
 position: absolute;
 width: 77.7%;
 background: #333333;
 border: 1px solid #666666;
 height: auto;
}

#copyright{
 position: absolute;
 height: 100px;
 width: 100%;
 margin-top: 20px;
 padding-top: 16px;
 background-image: url(images/copyright.png);
 background-repeat: repeat-x;
 text-align: center;
 color: #FFFFFF;
 font-family: Arial;
}
a{
 font-weight: bold;
 color: #FFFFFF;
}
a:hover{
 color: #FF9900;
}
img{
 border: 0px;
}



HEEEEEEEEEEEEELP !

Merci d'avance pour vos réponsses...

3 réponses

bonjour
on a pas tous le séléments:<?php include ('include/head.html'); ?>
0
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 51
2 juin 2008 à 17:15
Désolé...

Voici head.html :

<head>
<link rel="shortcut icon" type="image/x-icon" href="images/favicone.bmp" />
<link href="design.css" rel="stylesheet" type="text/css">
<meta name="dc.description" content="LE site d'aide informatique, programmation, hacking, P2P, Bittorent, Délirs, Jeux, ... Avec un forum, un blog,... Bref, un BORdel INFOrmatique." />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<title>Bienvenue sur Bordinfo, le site d\'informatique pour tous !</title>
<meta name="robots" content="all" />
<link rel="generateur-meta" href="http://www.referencement-fr.com/" />
<meta name="description" content="Site d'informatique destiné à tous. Vous y trouverez des tutos, une bonne logithèque, des news, un forum d'entre-aide, un blog, des jeux, ..." />
<meta name="keywords" lang="fr" content="informatique, ordinateurs, ordinateur, materiel, materiels, informations, information, info, infos, news, actualites, actualités, actualité, programmation, P2P, Bittorent, astuces, astuce, telechargement, telechargements, téléchargement, téléchargements, aide, Linux, Windows, gratuit, gratos, forum, blog, ReagtOS, Vixta, Bug, news, new, Bugs, Délir, Délirs, Hackeur, Hackeurs, Hacking, windows, Cracks, Crack, pc, mp3, Crackeur, Crackeurs, logiciel, logiciels, Piratage, pilotes, pilote, PHP, Javascript, Java, C++, drivers, driver, HTML, XHTML, pilote, DHTML, freeware, shareware, macrosoft, CSS, Patator, Windaube, MSN, Hacking MSN, Pirater MSN, Pass, Mot de Pass, cd-r, CDR, cd-rom, dvd-rom, dvd, outils, graveur, gravure, site, internet, dossier, dossiers, astuces, conseil, conseils, net, liens, télécharger, télécharge, telecharger, telechargement, BORDINFO.ATH.CX, jeux, blagues, blague, vidéo, vidéos, html, logs, musique, lecteur, webmaster, création, referencement, Bordinfo, Bordinfo.olympe-network.com, BORDINFO" />
<meta name="reply-to" content="h4ck.n3t@gmail.com" />
<meta name="category" content="Internet" />
<meta name="distribution" content="global" />
<meta name="author" lang="fr" content="h4ck.n3t & Andrelec1" />
<meta name="copyright" content="Bordinfo.olympe-network, tout droits réservés, Copyright 2008 et jusqu'a la fin des temps :)" />
<meta name="generator" content="Notepad++, Dreamweaver, FileZilla" />
<meta name="identifier-url" content="http://bordinfo.olymp-network.com" />
<meta name="expires" content="never" />
<meta name="Date-Creation-yyyymmdd" content="01/01/07" />
<meta name="Date-Revision-yyyymmdd" content="20/05/08" />
<meta name="revisit-after" content="15 days" />
</head>


Voila :)
0
salut
pour la structure principale, header, menu, contenu et footer, pourquoi tu mélanges les id et les tableaux.tu peux faire des tableaux à l'intérieur des div.si je vois bien les éléments du site sont à l'intérieur d'un tableau.je ne ferais pas comme çà, d'après tous les tutos que j'ai étudié.
0
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 51
2 juin 2008 à 18:09
Pourais-tu me proposer une structure correcte ? J'aimerais que le corps et que le menu de gauche soit extenssibles...

Merci d'avance...
0
Brachior Messages postés 613 Date d'inscription dimanche 21 octobre 2007 Statut Membre Dernière intervention 22 juin 2009 46 > hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014
2 juin 2008 à 18:12
0
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 51 > Brachior Messages postés 613 Date d'inscription dimanche 21 octobre 2007 Statut Membre Dernière intervention 22 juin 2009
3 juin 2008 à 12:05
Merci beaucoup, mais premièrement je l'ai déjà entiéremnent lut, et secondement, il propose un design FIXE et non DYNAMIQUE !!!!

Merci quand même
0
ideal > hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014
2 juin 2008 à 19:05
http://helpevent.free.fr/pulcino/

css


/***********************************************/
/* HTML tag styles */
/***********************************************/

body{
font-family: Arial,sans-serif;
color: #333333;
line-height: 1.166;
margin: 0px;
padding: 0px;
font-size: 80%;
}
#header{
padding: 10px 0px 0px 0px;
border-bottom: 1px solid #cccccc;
width: 100%;
background-color: #00CC00;
height: 60px;
}
/************* menu ***************/
#menu_gauche{
float: left;
width: 20%;
margin: 0px;
padding: 0px;
background-color: #99FF00;
border-right: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
.elementmenu{
padding-top: 0px;
margin: 0px;
text-align: left;
padding-bottom: 10px;
}
.elementmenu ul{
margin: 0px;
font-size: 12px;
padding-top: 20px;
line-height: 20px;
padding-bottom: 5px;
list-style-type: none;
padding-left: 5px;
}
/************* centre ***************/
#content{
float: left;
width: 70%;
}
#page_centre{
margin-left: 40px;
margin-top: 20px;
}

/************* footer ***************/

#footer{
clear: both;
font-size: 75%;
color: #cccccc;
padding: 10px 10px 10px 10px;
background-color: #00CC00;
}
#footer img{
padding: 4px 4px 4px 10px;
vertical-align: middle;
}
0
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 51 > ideal
3 juin 2008 à 12:14
Merci beaucoup ! Je test tout de suite, et je clos si c'est OK...
0
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 51
3 juin 2008 à 12:29
Merci 1000 fois !!!!!

C'est exactement comme je voulait...

A+ et vive le CSS :)
0
ideal23 Messages postés 456 Date d'inscription mercredi 30 avril 2008 Statut Membre Dernière intervention 16 mai 2014 28
3 juin 2008 à 13:11
heureux d'avoir pu rendre service.
0
hack_net Messages postés 783 Date d'inscription lundi 5 mars 2007 Statut Membre Dernière intervention 5 juin 2014 51 > ideal23 Messages postés 456 Date d'inscription mercredi 30 avril 2008 Statut Membre Dernière intervention 16 mai 2014
3 juin 2008 à 19:12
Je t'ai mis sur ma barre de copyright en bas : "Structure: ideal, CSS: ideal et hack_net"

^^ A+ et encore merci :)
0