overflow: auto et tableau

overflow: auto et tableau - HTML/CSS - Programmation

Marsh Posté le 08-11-2005 à 01:06:20    

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 :

Citation :

"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 :

Citation :

<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

Citation :

#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...

Reply

Marsh Posté le 08-11-2005 à 01:06:20   

Reply

Marsh Posté le 08-11-2005 à 18:46:05    

Je débute en conception web et le CSS m'apparait comme la solution à ce genre de pbs. Plutot que ta table, pourquoi ne pas faire un div avec les marges adéquates?

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed