Discussion :

[tchize_]

bonjour, j'ai grosso merdo le code suivant (extrait avec firebug)

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
 
<div style="overflow: hidden; position: absolute; z-index: 2; width: 927px; height: 543px;" id="_id168:graphPanelContentDiv" class="dr-mpnl-pnl rich-mp-content">
  <table cellspacing="0" cellpadding="0" border="0" style="width: 300px;" id="_id168:graphPanelContentTable">
    <tbody>
      <tr style="height: 1%;">
        <td class="dr-mpnl-header rich-mpnl-header-cell">
          <div style="float: right; padding-top: 3px; padding-right: 3px;" class="dr-mpnl-pnl-text rich-mpnl-text rich-mpnl-controls"><a href="#" name="_id168:hidelink" id="_id168:hidelink">X</a></div>
          <div style="white-space: nowrap; cursor: move;" id="_id168:graphPanelHeader" class="dr-mpnl-pnl-text dr-mpnl-pnl-h rich-mpnl-text rich-mpnl-header">Graph</div>
        </td>
      </tr>
      <tr style="height: 99%;">
        <td valign="top" style="border: 1px solid red; overflow: scroll;" class="dr-mpnl-pnl-b rich-mpnl-body">
          <div style="border: 1px solid black;" class="graphPicture"><img id="_id168:zoom4times2" src="/intranet/processStatus.png?id=801_ServerAcceptanceTest_ServerAcceptanceTest_wp1&amp;zoom=2" alt="zoom 4/1" />
          </div>
        </td>
      </tr>
    </tbody>
  </table>
</div>

ce que je n'arrive pas a comprendre, c'est que malgrès un width fixé sur la table et un overflow:scroll sur le td, mon navigateur (firefox 3) s'obstine à élargir la taille à celle de l'image "graphPicture" (qui fait 3000px de large) au lieu de permettre le défilement dans le td. (voir screenshot)

Quelqu'un aurait-il une solution à me proposer, le but étant d'avoir du défilement dans la cellule au lieu d'avoir une table qui s'agrandi et déborde de mon div?

edit: j'ai aussi essayé le table-layout:fixed, ca résoud le problème d'élargissement à droite, mais pas celui d'agrandissement vers le bas. Et en plus, je suis obligé d'utiliser le table (généré par un composant server-side, je peux juste jouer avec le css :s)

[desert]

Salut,
As-tu essayé de fixer la largeur et la hauteur de ta cellule ?
Ou peut-être tenter de mettre la propriété overflow sur le div enfant plutôt que la balise td.
Ou bien les deux ?

[tchize_]

j'ai déjà essayé: overflow sur les deux: pas d'effet.

Fixer la taille du td: solution inaceptable et non testée. Le div entourant la table est créé par javascript. Je n'ai pas vraiment de controle sur celui-ci. Tout ce que je sais c'est qu'il a une taille fixe, donc qui peux, normalement servir en css comme base pour mettre dedans des child ayant une taille relative. Mon problème c'est que le table ignore méchament la taille imposée et que, au niveau de la création de mon div interne, j'ignore quel sera la taille donnée au div externe.

Bien sur, si en css, on pouvait mettre quelque chose du genre style="height:taille du nième parrent - 50px" ça m'irait, mais je pense que je rêve un peux pour ce genre de support