hello, j'aimerais faire un code qui permette de redimensionner dynamiquement un combo en utilisant l'attribut 'size'. J'ai préparé un exemple qui met en évidence le problème qui est à l'origine de ma récente calvitie.

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
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html>
  <head>
    <script language="JavaScript">
      function updateCombo() {
        var obj = document.getElementById('myCombo');
        if (obj.size == 1) obj.size = 5;
        else obj.size = 1;
      }
    </script>
  </head>
  <body>
    <table style="border:solid 1px black">
      <tr style="vertical-align:top">
        <td style="border:solid 1px red">
          <input type="button" value="test" onclick="updateCombo()"/>
        </td>
        <td style="border:solid 1px blue">
          <select multiple="true" size="1" id="myCombo">
            <option>value 1</option>
            <option>value 2</option>
            <option>value 3</option>
            <option>value 4</option>
            <option>value 5</option>
            <option>value 6</option>
            <option>value 7</option>
            <option>value 8</option>
            <option>value 9</option>
            <option>value 10</option>
          </select>
        </td>
      </tr>
    </table>
  </body>
</html>
Le problème est que dans firefox, le <table> ne s'adapte pas au combo lorsque celui-ci s'agrandit:

Nom : combo01.png Affichages : 99 Taille : 2,7 Ko

Si je redimensionne la fenêtre de firefox, la table d'adapte au contenu:

Nom : combo03.png Affichages : 85 Taille : 2,6 Ko

Par contre si je clique à nouveau sur le bouton, le combo est censé se réduire et la <table> s'adapter, mais voici ce que ça donne:

Nom : combo02.png Affichages : 86 Taille : 1,7 Ko

Seul le <td> qui contient le combo se redimensionne, mais pas les autres <td> de la ligne. Ca me dépasse un peu... une idée de quoi ça peut venir et comment y rémédier ?

Merci d'avance