[html] Hauteur de tableau fixe sous IE9 avec DIV

Fermé

masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017 - 19 mars 2015 à 14:22
masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017 - 19 mars 2015 à 16:58

Bonjour,

J'ai un souci avec un tableau qui contient un <DIV> dans une cellule. Cette <DIV> contient beaucoup d'info et j'utilise un style "overflow:auto" pour que sa hauteur reste fixe. Exemple :


<table>
<tr>
<td height='100'>
<div style='width:500px;height:100px;overflow:auto;'>
Mon texte qui fait plus de 100px de hauteur...
</div>
</td>
</tr>
</table>

Cela fonctionne très bien sous Firefox et sous Safari, mais... pas sous Internet Explorer 9 ! Sous IE9, la <DIV> garde sa hauteur de 100px, mais pas la cellule qui prend la hauteur du texte contenu dans la <DIV>, ce qui crée de grand espaces vides dans la cellule...

Est-ce que qqun a une idée comment gérer ce souci ?
Je sais qu'il y a la possibilité de laisser tomber les tableaux et de ne créer que des <DIV> gérées en CSS, mais ça me prendrait trop de temps de tout reprendre et de changer de "technologie"...

Merci pour vos réponses et conseils.

A voir également:

[html] Hauteur de tableau fixe sous IE9 avec DIV
Tableau croisé dynamique - Guide
Tableau ascii - Guide
Tableau word - Guide
Trier tableau excel - Guide
Editeur html - Télécharger - HTML

3 réponses

Réponse 1 / 3

jordane45 Messages postés 38372 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 9 janvier 2025 4 722
19 mars 2015 à 15:16

Bonjour,
Je n'ai pas IE9 sous la main pour tester ....
mais il me semble qu'avec un max-height en plus..ça devrait le faire

<div style='width:500px;max-height:100px;height:100px;overflow:auto;'>

masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017 31
19 mars 2015 à 15:20

Hello, non ça ne change rien :-(

Réponse 2 / 3

jordane45 Messages postés 38372 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 9 janvier 2025 4 722
Modifié par jordane45 le 19/03/2015 à 15:27

Et si tu change ton

overflow:auto

par

overflow-x:scroll

?
Oui ça fait apparaitre la barre de défilement en permanence.. mais est-ce que ça corrige le problème de taille ?

Cordialement,
Jordane

masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017 31
19 mars 2015 à 15:53

Alors j'ai essayé plutôt

overflow-y:scroll

, mais ça fait toujours la même chose...

jordane45 Messages postés 38372 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 9 janvier 2025 4 722 > masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017
19 mars 2015 à 16:04

ah oui.. Y pardon.
Par contre.... tu n'as pas de CSS qui pourrait prendre le pas sur le style que tu marques en dur ?

Sinon tu peux encore essayer ça (avec du CSS) :

#tonDiv{
max-height:100px; 
height: expression(this.scrollHeight>100?"100px":"auto");  
Overflow:auto;
	}

masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017 31
19 mars 2015 à 16:29

Snif... toujours la même chose...

masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017 31
19 mars 2015 à 16:58

Par contre, je commence à isoler le problème : ça fait du fait que le contenu du champ <DIV> est de l'html enrichi qui est en fait une autre page web. Je continue à creuser...

Réponse 3 / 3

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 525
19 mars 2015 à 15:34

Salut,

Ou peut-être en appliquant un style sur la balise td ?

<td style='height:100px;'>
<div style='width:500px;height:100px;overflow:auto;'>
Mon texte qui fait plus de 100px de hauteur...
</div>
</td>

masterdim Messages postés 51 Date d'inscription lundi 8 août 2005 Statut Membre Dernière intervention 26 juillet 2017 31
19 mars 2015 à 15:57

Hello,
Malheureusement, pas de changement...
La seule option que je vois, c'est d'utiliser un <textarea> au lieu d'un <div>. Cela résoud mes problèmes de hauteur, mais cela m'en crée d'autres : le texte qui figure dans le conteneur est de l'html enrichi provenant d'une bdd et je me retrouve à avec le code html non interprété qui s'affiche dans la <textarea>...

Discussions similaires

Dimensions L x l x H : comment lire ces infos ?

generateur de combinaison du loto 5/90

Bibliothèque

Formule taux de marque

Nom de champs du tableau croisé dynamique non valide