Team-Azerty

par **Aurelienazerty** sur Mer 10 Oct 2007, 15:27:29

Je souhaite faire un tableau en HTML dont la partie gauche contenant les libellé reste fixe, et que les donnée soient découlante à l'image de ce qui se fait avec Excel (figer les volets) :

Code: Tout sélectionner: +-------------------------------------------+ + Libellé + Val1 + Val2 + Val3 + Val4 + ....+ +-------------------------------------------+ + titi + 1 + 2 + 3 + 4 + ....+ +-------------------------------------------+ + toto + erre + fdgg + fgg + fsdf + ....+ +-------------------------------------------+

Les "..." étant la suite des valeurs accessibles via une scroolbar.

Dans ma page HTML, il peut y avoir plusieurs tableaux de ce type, et pour chacun, j'aimerais qu'il prenne 100% de l'espace de son conteneur père.
Il faut que ça passe sous IE 6&7 et Firefox.

Merci de votre aide.

par **marm** sur Mer 10 Oct 2007, 15:50:19

Code: Tout sélectionner: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>one</title> <style type='text/css'> td.headcol {width:auto;} </style> </head> <body> <div style="width:100%;overflow:auto;"> <table border="1" style="width:100%;overflow:hidden;"> <tr colspan=5> <td class='headcol' id='col1'>one</td> <td class='headcol' id='col2'>two</td> <td class='headcol' id='col3'>three</td> <td class='headcol' id='col4'>four</td> <td style="width:10px;"></td> </tr> </table> <div> <div style="width:100%;height:200px;overflow-Y:auto;"> <table border="1" style="width:100%;overflow:hidden"> <script type='text/javascript'> var largcol = new Array() for (i=1;i<5;i++){ largcol[i]=parseInt(document.getElementById('col'+i).offsetWidth)-3 + "px"; } for (i=0;i<55;i++){ document.write("\<tr\>\<td style='width:"+largcol[1]+"'\>dsfqsdfsdd dsqf qsdf sdqf sqdf qsdf sdf  \<\/td\>\<td style='width:"+largcol[2]+"'\>two\<\/td\>\<td style='width:"+largcol[3]+"'\>three\<\/td\>\<td style='width:"+largcol[4]+"'\>four\<\/td\>\<\/tr\>" ) } </script> </table> <div> </body> </html>

Bien sur ce n'est pas de moi

par **Aurelienazerty** sur Mer 10 Oct 2007, 15:57:14

L'idée est pas mal, mais le scroll n'est pas au bon endroit (vertical, je cherche un horizontal)

par **Davidazerty** sur Mer 10 Oct 2007, 19:22:44

Tu veux faire ca avec un iFrame dans le tableau.

Code: Tout sélectionner: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>one</title> <style type='text/css'> table, tr, td { border: 1px solid black; border-collapse: collapse; } </style> </head> <body> <table border="0" width="300px" style="overflow:hidden;"> <tr> <td width="200px">libelle one</td> <td rowspan="3"> <iFrame src="...." width="100%" style="scrolling:auto;border:0px"></iFrame></td></tr> <tr> <td width="200px">libelle two</td></tr> <tr> <td width="200px">libelle three</td></tr> </table> </body> </html>

Voici la doc sur la balise iFrame.
http://www.w3schools.com/tags/tag_iframe.asp

par **Aurelienazerty** sur Jeu 11 Oct 2007, 8:42:02

Sans Iframe, ça serait mieux, sachant que sur un DIV, en jouant avec le propriété overflow, tu peux avoir le même effet.
Mais merci quand même

par **Nicolazerty** sur Jeu 11 Oct 2007, 12:38:38

rassures moi c'est pas pour un usage pro ta demande?

par **Aurelienazerty** sur Jeu 11 Oct 2007, 14:30:28

J'ai résolu mon problème grâce à ces 2 sites:

Team-Azerty

[HTML/CSS] tableau avec rendu type figer les volets

[HTML/CSS] tableau avec rendu type figer les volets

en vertical

ou pas

C'est bon

Qui est en ligne ?