Forum d'entraide PHPFrance

Bonjour,

j'ai un tableau html composé de 2 colonnes.
La premières colonnes a 2 lignes, la secondes 1 seule (avec un colspan=2)

La 1ère ligne de la 1ère colonne a un contenu variable, je ne peu pas fixer sa hauteur par un height.
La 2ème colonne a aussi un contenu varialble je ne peux pas metter de height.

Mon problème est que j'aimerais que la cellule de la 1ère ligne de la 1ère colonne s'arrete dès que son contenu est terminé. Afin que juste après la 2ème ligne commence.
En clair je veux que la 1èer ligne soit le plus court possible et que la 2ème s'étire en hauteur.

Mais ici, mes 2 lignes s'étirent, et c'est la 1ère qui s'étire le plus.

Et même si je mets un height fixe à ma première ligne cela ne change rien et elle reste trop grande.

J'ai aussi remarqué que cette celulle ajoutait plein de retour à la ligne inutile. Par exemple si je mets 50 caractères, au lieu de prendre les 3 lignes de caractère, la cellule est très grande et ca me donne 10 lignes vides.

Solu

Utilise le css !
en effet avec le css tu as une commande magique qui s'apelle :

Code : Tout sélectionner

table-layout:fixed;

tu utilise une class avec cet option là puis sinon tu ne touche pas au autre, ils auront donc un contenu variable. Cette option ne te dispense pas d'utiliser les balise height, et widht, mais si tu utilise cette commande la taille fixer prone sur le texte rentré, mais attention au réaction si ton texte est trop long..

La premières colonnes a 2 lignes, la secondes 1 seule (avec un colspan=2)

un colspan... ou un rowspan ????
Si c'est la seconde option, tu aurais une astuce: crées une troisième ligne et mets dedans un pixel transparent, et un rowspan de 3 sur la deuxième colonne.

Si ça ne fonctionne pas, fais voir un peu le code qu'on trouve le bobo.

Voici le code du tableau en question :

Code : Tout sélectionner

  <table width="800" border="1" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
    <tr> 
      <td width="110" height="99"><img src="image/logo.jpg" width="110" height="99"></td>
      <td width="15" height="99"><img src="image/BandeauLogo.jpg" width="15" height="99"></td>
      <td colspan="2" width="470" height="99"><img src="image/Banners/bienvenue.jpg" width="470" height="99"></td>
      <td  width="15" height="99"><img src="image/BandeauLogo.jpg" width="15" height="99"></td>
      <td width="190" height="99">
      <script language="JavaScript">
if (document.getElementById || document.all){
document.write('<div style="position:relative;overflow:hidden;width:'+swidth+';height:'+sheight+';clip:rect(0 '+swidth+' '+sheight+' 0);background-color:'+sbcolor+';" onMouseover="sspeed=0;" onMouseout="sspeed=resumesspeed">')
document.write('<div id="slider" style="position:relative;width:'+swidth+';">')
document.write('</div></div>')
}
</script>
      </td>
    </tr>
    <tr> 
      <td colspan="6" width="800"  height="38"><img src="image/BarreHaut.jpg" width="800" height="38"></td>
    </tr>
    <tr>
      <td width="110" height="40"><img src="image/gauche.jpg" width="110" height="40"></td>
      <td width="15"  height="40"><img src="image/Barreangle.jpg" width="15" height="40"></td>
      <td width="25"  height="40"><img src="image/rondangle.jpg" width="25" height="40"></td>
      <td bgcolor="#ffffff" width="445"  height="40"></td>
      <td colspan="2" bgcolor="#ffffff"></td>
    </tr>
    <tr>
      <td  height="100"><? include('menugauche.php');  ?></td>
          <td width="15"  class="barregauche"></td>
          <td bgcolor="#ffffff" rowspan="3" colspan="4" height="800">
                
                

                 <? include($centre);   ?>
                          <br />
         <br />
				 <hr />   
				 <br />
         <br /> 
          <div align="center">
          Réalisation :  Contact:<BR />
          Hébergement <BR />
          <a href="?page=reglement">Condition d'utilisation</a>
          </div>



          </td>
    </tr>
    <tr>
      <td width="110" valign="top" bgcolor="#ffffff"><img src="image/RondBas.jpg" width="110" height="130"></td>
      <td width="15"  valign="top" bgcolor="#ffffff"><img src="image/BarreRondBas.jpg" width="15" height="130"></td>

    </tr>
  </table>

Cibler le problème :
la page menugauche.php est un menu qui peut augmenter sa taille en hauteur, la cellule qui le contient doit donc pouvoir augmenter en fonction des rollover.
la page $centre c'est du texte plus ou moins long.

Je veux que l'image RondBas.jpg colle au menu, et que ce qui y en dessous de l'image soit en blanc jusqu'à la fin de tableau.
la hauteur du tableau varie en fonction de $centre.

J'ai utilisé table-layout:fixed;
C'est vrai que si mon $centre est très long, alors le rondBas.jpg n'est plus collé au dessus.

Le pixel transparent, il change rien.

Forum d'entraide PHPFrance

Etirer une cellule d'un tableau

Etirer une cellule d'un tableau

Re: Etirer une cellule d'un tableau