Utiliser les <table> pour un site "redimensionnable"

**bernardlamotte** · 03/11/2009, 11h59

Bonjour à tous,

Ça fait maintenant 2 ans que je fais pas mal de web (HTML, CSS, JS) et on me demande souvent de faire un site qui soit "redimensionnable" (en fonction de la taille de la fenêtre), Je sais qu'on peut utiliser les <table> pour ça, cependant on m'a toujours dit que coder avec des <table> n'était pas "propre".

Qu'en pensez-vous et avez vous de meilleures solutions ??

Merci d'avance !!

Nico

**ledisciple** · 03/11/2009, 13h26

Envoyé par bernardlamotte

soit "redimensionnable" (en fonction de la taille de la fenêtre),

Tu ne voulais pas dire en fonction de la taille de l'écran?

Envoyé par bernardlamotte

Je sais qu'on peut utiliser les <table> pour ça, cependant on m'a toujours dit que coder avec des <table> n'était pas "propre".

vade retro satanas !!!

C'est pas pour rien que l'on utilise les div maintenant !!!

pourquoi tu n'essayes pas de mettre des pourcentages dans tes div ?

**bernardlamotte** · 04/11/2009, 11h22

Salut,

Tout d'abord merci de ta réponse, ensuite non je veux vraiment dire en fonction de la taille de la fenêtre (en enfin je crois

)... Par exemple, si je réduit ma fenêtre de moitié, j'aurais voulu que mon div ce réduise de moitié aussi.

Effectivement, j'ai déjà fait plusieurs essais avec des tailles en % mais ça m'a jamais vraiment satisfait... Je m'explique : Imaginons que j'ai deux div en float:left dans ma page, le 1er div fait 150px de large et l'autre doit prendre toute la place qui reste, je fais alors un truc genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<html>
<head>
 
</head>
 
<body>
 
<div style="background:blue; float:left; width:150px;">div 1</div>
<div style="background:red; float:left; width:100%;">div 2 </div>
</body> 
 
</html>

Mais mon deuxième div passe à la ligne et fait 100% de la fenêtre...

Merci !!

ps : mon explication n'est peut être pas très clair...
Donc comment faire ça sans un bon vieux table ni en js ?!

**E.Bzz** · 04/11/2009, 12h06

Bonjour,

Envoyé par bernardlamotte

Mais mon deuxième div passe à la ligne et fait 100% de la fenêtre...

Non, du body : c'est ce que tu lui demandes (du coup, pas la place pour les 150px de l'autre).

De manière générale, une taille en % ne devrait être prise en compte que si la taille du parent est définie explicitement (puisqu'il s'agit d'un % par rapport au parent, justement) ...

A+

**bernardlamotte** · 04/11/2009, 15h09

Hello,

Merci de t'as réponse, je crois que je comprends ce que tu veux dire !!! Mais comment résoudre le problème alors (mis à part mettre une taille fixe sur le div parent) ?!?! Utiliser un table

Nico

**slack457** · 04/11/2009, 23h25

Bonjour,

ce problème m'intéresse beaucoup, mais je ne comprend pas très bien,

est-ce qu'il faudrait donner une taille en % au body (genre 100%), pour pouvoir donner une taille en pourcentage à un enfant du body ?

Est-ce que cela répondrait au problème ?

Si j'ai compris, si on a une "arborressence" du genre : body > div1 > div2
alors si on met une taille en % au div2, ce pourcentage sera pris en compte à partir de la taille du div1 ?

**ledisciple** · 05/11/2009, 09h46

Envoyé par slack457

Si j'ai compris, si on a une "arborressence" du genre : body > div1 > div2
alors si on met une taille en % au div2, ce pourcentage sera pris en compte à partir de la taille du div1 ?

oui, si tu met 80% au premier des cadres, le deuxième cadre sera d'au maximum 80 %

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<div style="width:80%;border: solid red 1px;">
<div style="width:100%;border: solid yellow 1px; ">
...
balval</div></div>

Envoyé par slack457

est-ce qu'il faudrait donner une taille en % au body (genre 100%), pour pouvoir donner une taille en pourcentage à un enfant du body ?

ton body par défaut est adapté à la fenêtre du client, mais tu n'est pas obligé de lui donner une taille. Si tu le réduit à 80%, la taille de tes div sera au max de 80%.

J'espère que j'ai été clair !!!

**slack457** · 05/11/2009, 22h26

Oui ça fait plaisir quand c'est aussi clair, merci

**bernardlamotte** · 06/11/2009, 08h33

Merci ledisciple pour toutes tes précisions ! Mais au risque d'avoir l'air chiant, ceci n'est répond pas vraiment à ma question...

J'ai bien compris que les div à 100% prennent la largeur du parent, mais alors comment faire cette exemple sans une <table>.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
 
<html>
  <head>
    <title>Title</title>
  </head>
 
  <body>
    <table width="100%">
      <tr>
        <td width="200">Je fais 200px</td>
        <td>Je prends tout le reste</td>
      </tr>
    </table>
  </body>
</html>