Aller au contenu

overflow: auto et tableau


korben

Sujets conseillés

Bonjour à tous,

La question qui me taraude l'esprit est assez simple : sur le site que je suis ne train de réaliser, j'essaie de faire un cadre, contenant une pseudo frame, qui part de top:120px et left:120px et qui va jusqu'en bas à droite. J'ai essayé de donner à ce cadre les tailles suivantes :

"document.body.clientWidth - 120px" et "document.body.clientHeight - 120px"

Malheureusement, cette expression ne fonctionnait pas avec Firefox.

Je me suis donc résolu à faire un simple tableau de taille 100% avec deux lignes (la hauteur de la première étant de 120 px de haut et l'autre prenant le reste du tableau) et deux colonnes (idem, sauf que c'est dans la largeur). Pour forcer ie à respecter la taille des cases, j'ai dû mettre dans la case en haut à gauche une image blanche de 120x120. Ce tableau étant en arrière plan, le header et la barre de gauche s'affiche par-dessus le tableau, et seul la case en bas à droite est affichée.

Dans cette case, il y a une pseudo-frame. Pour que l'attribut overflow: auto fonctionne sur cette case, j'ai du inclure le tableau dans un div (height et width ="100%") ayant cette attribut. Le problème est que dans ce cas, c'est l'ensemble du tableau qui défile avec la barre de défilement, et cette dernière s'affiche le long de TOUT le tableau, donc elle est en partie cachée sous le header. C'est pas beau, et pour les résolutions très faible, la barre de défilement peut disparaître complétement! J'aimerais donc que la barre ne s'affiche que sur la case en bas à droite. J'ai essayé d'inclure un div dans cette case (avec l'attribut overflow: auto), mais dans ce cas-là, ce div ne respecte plus la taille de son conteneur et déborde sous le tableau.

Si quelqu'un sait comment je dois m'y prendre, je l'en remercie grandement d'avance (et d'ailleurs, je remercie aussi ceux qui ne savent pas mais qui se sont quand même fait ch_er à lire jusqu'ici).

Pour info, voici l'adresse de la page :

http://kellibickman.net/kelli.php

et voici le code de la partie concernée :

<div id="maincontent">

<table height="100%" width="100%" border="0" cellpadding="0" cellspacing="0">

<tr height="120px"><td width="120px"><img src="files/whitebox.jpg" width="120px" height="120px"></td><td></td></tr>

<tr><td></td><td>LA PSEUDO FRAME</td></tr>

</table>

</div>

et le CSS

#maincontent{

top: 0px;

left: 0px;

position: absolute;

width:100%;

height:100%;

overflow: auto;

}

Au secour Obiwan Ki-que-vous-soyez, vous êtes mon seul espoir...

Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
×
×
  • Créer...