[Urgent] Div Avec Scroll Horizontal Uniquement

Bonjour,
Le problème est simple (enfin il semble...), je souhaite faire un tableau sur une seule ligne et comme ce tableau est trop large je l'intègre dans une div à laquelle j'applique un overflow:auto; et une width:100%.

Jusque là rien de bien compliquer mais FireFox et IE n'ont pas l'air de comprendre ce que je veux faire .

Voilà les affichages :



IE mets les scrollbars sauf que la hauteur fait genre 2px peu importe le contenu du tableau et FIreFox explose mon site ... Après plusieurs essai j'ai remarqué que sous IE si je mets un <p> à la place du tableau la hauteur s'adapte mais aucun changement sous FireFox si la ligne est trop grande le fieldset dépasse du corps de ma page...

Voilà le code :

<fieldset style=\"width:97%; margin : 5px; padding-right:0; color:black;\">
<legend style=\"color:black;\"><strong>Liste</strong></legend>
	<div id=\"tableSelect\" style=\"width:100%; overflow: auto; \">
		<table width=100% cellspacing=\"0\" style=\"border-left:1px solid; border-bottom:1px solid;\" >
			<thead>
				<tr>
					<th>XXXXXXXX</th>		
					<th>XXXXXXXX</th>		
					<th>XXXXXXXX</th>	
					<th>XXXXXXXX</th>	
					<th>XXXXXXXX</th>	
					<th>XXXXXXXX</th>	
					<th>XXXXXXXX</th>
					<th>XXXXXXXX</th>
					<th>XXXXXXXX</th>
					<th>XXXXXXXX</th>
					<th>XXXXXXXX</th>
					<th>XXXXXXXX</th>
					<th>XXXXXXXX</th>
					<th>XXXXXXXX</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
					<td>XXXXXXXX</td>
				</tr>
			</tbody>
		</table>
	</div>
</fieldset>

Si quelqu'un trouve une solution, il aura ma reconnaissance éternel .
Merci à tous ceux qui se pencheront sur le problème .
Modifié par KiruSOka (06 Jun 2009 - 22:30)

Hello,

j'ai remis l'aperçu de ton image puisqu'il sert justement à conserver la mise en page du forum.

Ok désolé pour l'image ^^

Sinon j'ai remarqué que pour la div qui affichait du code dans un post sur le forum, il y a une scrollbar uniquement en bas et que la hauteur s'adapte au contenu ... à quelque chose près c'est ce que je veux sauf que je veux mettre un tableau à la place du code.

Si quelqu'un peut me trouver juste comment faire ça je devrais m'en sortir .

C'est quand même bizarre de pas réussir à faire une div avec juste une scrollbar en bas et une width en pourcentage et une hauteur qui s'ajuste au contenu tableau ou non .

Merci d'avance à celui qui trouvera une solution.

En ajoutant "overflow: auto", le scroll horizontal ou vertical s'ajouteront automatiquement si c'est nécessaire pour afficher l'ensemble du contenu de ton tableau.

Pourquoi ne délimites-tu pas la largeur de ta div, par exemple : "width: 500px", ainsi que la hauteur.
Cela permettra à FF de ne pas étendre le tableau selon la largeur de ta fenêtre et aussi, cela permettra à IE d'avoir une hauteur minimum.

L'autre chose que je tenterais, c'est de ne mettre aucune indication de largeur pour que ta div prenne automatiquement la largeur de son contenu, soit celle du fieldset.