élasticité d'un tableau

grodep · 12 Février 2010

Bonjour à tous, je suis en train de m'arracher les cheveux alors avant qu'il ne m'en reste plus du tout, je me tourne vers vous en esperant entrevoir la solution qui, je suis sur, est sous mes yeux aveugles ... :

ma page modèle est créé sous forme de tableau dont la dernière colonne est élastique. Malheureusement, je n'arrive plus à changer la largeur de ma colonne centrale sans "perdre" l'élasticité de celle-ci! Je vous livre le code complet, je ne sais pas si ça se fait, mais je ne vois pas comment vous montrer le problème autrement sachant que mon ftp ne semble plus fonctionner actuellement... Je voudrais pouvoir augmenter la taille de la colonne centrale(celle qui contient les régions éditables 3 et 4) afin de justement bénéficier d'un texte écrit sur une plus grande largeur dans ces régions.Le voici donc:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- DW6 -->
<head>
<!-- Copyright 2005 Macromedia, Inc. All rights reserved. -->
<!-- TemplateBeginEditable name="doctitle" -->
<title>Page d'accueil</title>
<!-- TemplateEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="mm_spa.css" type="text/css" />
<!-- TemplateBeginEditable name="head" --><!-- TemplateEndEditable -->
</head>
<body bgcolor="#990000" background="mm_bg_red.gif">
<table border="0" cellspacing="0" cellpadding="0">
  <tr bgcolor="#220103">
   <td rowspan="2" colspan="2" nowrap="nowrap"><img src="../images/mm_spa_photo1.jpg" alt="Header image" width="215" height="108" border="0" /></td>
   <td colspan="2"  height="55" nowrap="nowrap" id="logo" valign="bottom">Site du PANVR</td>
   <td width="237" rowspan="2"><img src="../images/mm_spa_photo2.jpg" alt="header image 2" width="237" height="108" border="0" /></td>
   <td width=100% rowspan="2"> </td>
  </tr>

  <tr bgcolor="#220103">
    <td height="54" colspan="2" nowrap="nowrap" id="tagline" valign="top">Pôle Aéronautique National à Vocation Régionale</td>
  </tr>

 <tr bgcolor="#FF9900">
 	<td colspan="6"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0" /></td>
 </tr>

 <tr bgcolor="#FF080E">
 	<td colspan="6"><img src="mm_spacer.gif" alt="" width="1" height="2" border="0" /></td>
 </tr>

 <tr bgcolor="#FF9900">
 	<td colspan="6"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0" /></td>
 </tr>

 <tr bgcolor="#FF080E">
 	<td colspan="6"><img src="mm_spacer.gif" alt="" width="1" height="18" border="0" /></td>
 </tr>

 <tr bgcolor="#FF9900">
 	<td colspan="6"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0" /></td>
 </tr>

 <tr bgcolor="#FF080E">
 	<td colspan="6"><img src="mm_spacer.gif" alt="" width="1" height="2" border="0" /></td>
 </tr>

 <tr bgcolor="#FF9900">
 	<td colspan="6"><img src="mm_spacer.gif" alt="" width="1" height="1" border="0" /></td>
 </tr>

 <tr>
    <td width="165" valign="top" id="navborder"><br />
	<table border="0" cellspacing="0" cellpadding="0" width="160" id="navigation">
    <tr>
          <td width="160"><a href="../index.html" class="navText">Accueil</a></td>
        </tr>
        <tr>
          <td width="160"><a href="../hist.html" class="navText">A propos du PANVR</a></td>
        </tr>
        <tr>
          <td width="160"><a href="../stages.html" class="navText">LES STAGES</a></td>
        </tr>
        <tr>
          <td width="160"><a href="../coop.html" class="navText">COOPERANTS</a></td>
        </tr>
        <tr>
          <td width="160"><a href="../contact.html" class="navText">CONTACT</a></td>
        </tr>

      </table>	 </td>
    <td width="50"><img src="mm_spacer.gif" alt="" width="50" height="1" border="0" /></td>
    <td width="367" valign="top"><img src="mm_spacer.gif" alt="" width="305" height="1" border="0" /><br />
	 <br />
	 <br />
  	<table border="0" cellspacing="0" cellpadding="0" width="368">
        <tr>
          <td width="540" class="pageName"><!-- TemplateBeginEditable name="EditRegion4" -->EditRegion4<!-- TemplateEndEditable --></td>
        </tr>
        <tr>
          <td class="bodyText"><!-- TemplateBeginEditable name="EditRegion3" -->EditRegion3<!-- TemplateEndEditable -->
          <p> </p></td>
        </tr>
      </table>
	   <br />
	 <br />	</td>
    <td width="50"><img src="mm_spacer.gif" alt="" width="50" height="1" border="0" /></td>
    <td width="237" valign="top"><br />
	<table border="0" cellspacing="0" cellpadding="0" width="190" bgcolor="#FFFFCC">
        <tr>
		  <td class="columnHeader" align="center"><!-- TemplateBeginEditable name="EditRegion6" -->EditRegion6<!-- TemplateEndEditable --><br /><br /></td>
        </tr>

       <tr>
       <td width="110" class="smallText"><p><!-- TemplateBeginEditable name="EditRegion5" -->EditRegion5<!-- TemplateEndEditable --><br /></p>
			 <br />          </td>
        </tr>
    </table>	</td>
	<td width="150"> </td>
  </tr>
  <tr>
    <td width="165"> </td>
    <td width="50"> </td>
    <td width="540"> </td>
    <td width="50"> </td>
    <td width="237"> </td>
	<td width=100% > </td>
  </tr>
</table>
</body>
</html>

merci à toutes les âmes charitables qui se pencheront sur ce problème

Locace · 12 Février 2010

Bon tout d'abord grodep, je dois te prévenir de deux choses : tu vas te faire incendier parce que tu construis un site avec des tableaux, et tu as un pseudo qui prête à blaguer.

Ensuite pour ton souci.

Si tu veux qu'un tableau ait une colonne elastique et les autres fixes voila ce que tu dois faire

<table width="100%"> <!-- Ici tu indique que ton tableau occupera tout l'espace. -->
<tr>
<td width="100px">...</td> <!-- Ici tu fixes ta première colonne -->
<td width="80px">...</td> <!-- Ici tu fixes ta deuxième colonne -->
...
<td>...</td> <!-- Ici tu n'indique rien. Ce qui fait que comme ta table a 100% de largeur, c'est cette colonne qui va prendre le reste de la place -->
</tr>
</table>

c'est tout

Modifié 12 Février 2010 par Locace

grodep · 14 Février 2010

Et bien merci locace pour cette réponse aussi rapide qu'efficace. Je savais bien qu'il fallait mettre une dernière colonne à 100%, ce que je n'avais pas vu et compris c'est que, dès que je touchais aux reglages de largeur d'une des autres colonnes, la dernière prenait une valeur fixe... ça va bien mieux désormais!

Par ailleurs, pourquoi ne faut-il pas construire de site à partir d'un tableau modèle? C'est quand meme bien pratique pour l'agencement de la structure, j'imagine qu'il s'agit d'un problème de compatibilité?

A une autre époque, c'était les frames qui étaient pointées du doigt, il ne fallait "surtout pas s'en servir", c'était le mal

merci encore

NB: pour le pseudo, j'suis pas inquiet ça fait une dizaine d'années que je l'utilise sur le net, dans l'ensemble, je n'ai pas trop eu à essuyer de mauvaises blagues

Modifié 14 Février 2010 par grodep

**Dadou** · 14 Février 2010

Les frames c'est toujours le mal, quand aux tableaux, même si tu les trouves pratique pour faire la mise en page, sémantiquement, ils ne servent pas à ça, ils servent à présenter des données tabulaires. Une bonne maitrise des CSS te permet de faire aussi bien sans les tableaux, une bonne référence pour apprendre : www.alsacreations.com

Connexion

élasticité d'un tableau

Sujets conseillés

grodep

Locace

grodep

Dadou

Veuillez vous connecter pour commenter

Parcourir

Activité