L'élément important dans mon exemple ci-dessous est le sélecteur de classe wideData. Je veux utiliser ceci pour faire apparaître le texte entouré d'un div largeData dans une boîte de défilement s'il ne peut pas être affiché sans provoquer l'affichage d'une barre de défilement horizontale dans la fenêtre du navigateur contenant (overflow: auto).CSS - limiter la largeur de la cellule à l'espace restant
Cela fonctionne comme je veux si la div n'est pas contenue dans une cellule de tableau (essayez de supprimer les éléments table, td et td dans l'exemple et vous verrez ce que je veux dire). Toutefois, si je le place dans une cellule de tableau, le texte contenu occupe toujours autant d'espace qu'il le souhaite et l'utilisateur doit faire défiler la page contenant pour voir le côté droit du texte.
Je ne souhaite pas spécifier des largeurs absolues sur la table ou la cellule. Cette mise en page doit être utilisée dans une situation où je veux afficher de grandes quantités de texte qui peuvent s'enrouler normalement mais qui sont entrecoupées occasionnellement de petits blocs de texte très large qui doivent être affichés sans emballage (et qui devraient apparaître dans leurs propres boîtes de défilement sans que la page contenant devienne vraiment large). Et je ne veux pas mettre une largeur absolue sur les éléments div - je veux afficher autant que possible du texte "large" (et je sais que mes utilisateurs n'ont pas une largeur d'écran/navigateur standard). PS: vous pouvez demander pourquoi je mélange des tables et CSS ou si je dois utiliser cette disposition. Je suis limité en ayant à vivre avec du contenu généré par un système qui n'est pas sous mon contrôle. Je peux changer les règles CSS - et si on les pousse, on pourrait utiliser quelque chose comme Greasemonkey pour modifier le code HTML fourni du côté client (je ne suis pas en mesure de le changer côté serveur).