Probleme taille cellule tableau html

Fermé
dimdoumouf - 8 avril 2009 à 09:28
 dimdoumouf - 8 avril 2009 à 10:07
Bonjour,
j'ai un problème pour un tableau en html css,

le problème est que j'ai un tableau de largeur 900px avec dedans 9 cellule sur la première ligne qui font 150px pour la première et 100px pour les 8 suivantes. Donc le tableau retrecie mes cellules et je ne veut pas qu'il les retrecissent .

<div class="haut" id="haut" style=" overflow:hidden; white-space:nowrap; width: 900px; height:30px; margin:0px; padding:0px;">

<table >
<tr>
<td style="width:150px; ">Type</td>
<td style="width:100px; ">Composante</td>
<td style="width:100px;">Partenariat</td>
<td style="width:100px;">Nom Partenaire</td>
<td style="width:100px;">Attribué</td>
<td style="width:100px;">Commission </td>
<td style="width:100px;">Recrutable</td>
<td style="width:100px;">Visa Ens.</td>
<td style="width:100px"></td>
</tr>
</table>
</div>
A voir également:

3 réponses

pijaku Messages postés 12263 Date d'inscription jeudi 15 mai 2008 Statut Modérateur Dernière intervention 4 janvier 2024 2 751
8 avril 2009 à 09:31
Salut,
8x100 = 800 +150 = 950. Essaie avec une valeur width = 950px.
0
Sandriine Messages postés 1255 Date d'inscription samedi 9 décembre 2006 Statut Membre Dernière intervention 18 août 2010 283
8 avril 2009 à 09:34
Tu ne peux pas avoir un tableau de 900px, avec la largeur actuelle de tes cellules qui font en tout 950px de la large.
Soit tu rétrécie un peu tes cellules pour obtenir 900px en tout, soit tu augmente la taille de ta table.

Cordialement,
Sandrine
0
Oui je sais que la somme est plus grande que celle des cellule

mais voilà, je souhaiterai que mes cellule dépasse et sois même couper a la fin car après la div défile horizontalement en fonction d'une autre div contenant le tableau.
Je vous met le code si vous voulez


<tbody>
<tr>
<td style="width:300px;">Nom</td>
<td >
<div class="haut" id="haut" style=" overflow:hidden; white-space:nowrap; width: 900px; height:30px; margin:0px; padding:0px;">

<table >
<tr>
<td style="width:150px; ">Type</td>
<td style="width:100px; ">Composante</td>
<td style="width:100px;">Partenariat</td>
<td style="width:100px;">Nom Partenaire</td>
<td style="width:100px;">Attribué</td>
<td style="width:100px;">Commission </td>
<td style="width:100px;">Recrutable</td>
<td style="width:100px;">Visa Ens.</td>
<td style="width:100px"></td>
</tr>
</table>
</div>
</td>
</tr>
<tr>
<td valign="top" >
<div class="gauche" id="gauche" STYLE="overflow: hidden; margin:0px; padding:0px;width: 300px; height:380px;">
<table>
<tr><td>ABMESELELEME Serge 1</td></tr>
</table>
</div>
</td>
<td valign="top" >
<div class="contenu" id="contenu" STYLE="overflow: scroll; width: 900px; margin:0px; padding:0px; height:400px;" onscroll="twAjusteDefillement(document.getElementById('contenu').scrollLeft,document.getElementById('contenu').scrollTop);">
<table style="display: block;">
<tr>
<td style="width:150px;">1 CEV SECT PRIVÉ </td>
<td style="width:100px;">MATMECA</td>
<td style="width:100px;">edza</td>
<td style="width:100px;">dzad</td>
<td style="width:100px;">3.00 </td>
<td style="width:100px;">dzad</td>
<td style="width:100px;">15/01/2009</td>
<td style="width:100px;">dzada</td>
<td style="width:100px;">MODIF</td>
</tr>
</table>
</div>
</td>
</tr>
</tbody>
</table>


avec la fonction javascript appeler par onscroll:

function twAjusteDefillement(_position1,_position2) {
document.getElementById("haut").scrollLeft = parseInt(_position1);
document.getElementById("gauche").scrollTop = parseInt(_position2);
//alert(_position1);
}


et en faite dé que je fait défiler ma div contenu a l'aide des scrolls, soit la div gauche ou la div haut défile aussi. l'idée générale étant de faire un tableau avec les en-tête fixe quand on défile le tableau vers le haut et les noms (1ere colonne) fixe quand je défile vers la gauche. Mais lors d'un défilement vers le haut la 1ere colonne défile aussi et lors d'un défilement vers la gauche les en-tête défile aussi.

maintenant mon problème est que avec cette méthode de div qui sépare les en-tête du contenu les entête ne sont pas aligné avec les données des colonnes associé
0