problème de css sous firefox

Nouveau WRInaute
Bonjour

Voici mon problème :
j'ai inséré une balise div à l'intérieur d'un table. Le div, le table et le td ont tous un height à 100% pour que ça prenne la hauteur maximale
dans n'importe quelle résolution.

J'ai mis bien sur un overflow:auto ou overflow-y:auto dans la balise div pour qu'il y ait un scroll en cas de hauteur trop importante du div mais sous firefox ça ne tient pas compte de la hauteur et le cadre fait plus que la hauteur maximale de la page et je voudrais qu'il n'y ait pas de défilement sur ma page
Tout ça marche sous IE mais pas sous Firefox

Est ce un bug de firefox ou y a-t-il une solution ?
:?
 
WRInaute impliqué
micheleow a dit:
Est ce un bug de firefox ou y a-t-il une solution ?

Firefox n'échappe pas plus que IE aux bugs... :wink:
Maintenant, ce ne serait pas la première fois que ça marche sous IE (qui dans l'ensemble est plus permissif) et pas sous FF... :roll:

Envoi ton url qu'on jette un zieu !
 
Nouveau WRInaute
je ne peux pas donner l'url

par contre le code de la page oui

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Accueil</title>
<link href="com.css" rel="stylesheet" type="text/css">
</head>
<body bottommargin="0" leftmargin="0" marginheight="0" marginwidth="0" rightmargin="0" topmargin="0" bgcolor="#000000">
<table width="764" border="0" height="100%" cellpadding="0" cellspacing="0" align="center" bordercolor="#313131">
<tr valign="top">
<td>
<table width="764" border="0" height="100%" cellpadding="0" cellspacing="0" align="center">
<tr valign="top">
<td>
<table width="100%" cellpadding="0" cellspacing="0" border="0" bgcolor="#FFFFFF">
<tr>
<td colspan="3">
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td colspan="9" width="100%" height="101"><!-- menu --><img src="spacer.gif" height="27" width="100%"></td>
</tr>
</table>
</td>
</tr>


</table>
<td>
</tr>
<tr valign="top">
<td height="90%">
<table width="100%" cellpadding="0" cellspacing="0" border="0" height="100%">
<tr>
<td width="56" height="16"><img src="images/rideau_gauche.jpg" border="0" width="56" height="16"></td>
<td width="20" height="16"><img src="images/ecran_hg.jpg" border="0" width="20" height="16"></td>
<td width="100%" height="16" background="images/ecran_haut.jpg"><img src="images/ecran_haut.jpg" border="0" width="90%" height="16"></td>
<td width="20" height="16"><img src="images/ecran_hd.jpg" border="0" width="20" height="16"></td>
<td width="56" height="16"><img src="images/rideau_droit.jpg" border="0" width="56" height="16"></td>
</tr>
<tr valign="top">
<td width="56" height=""><img src="images/rideau_g.jpg" border="0" width="56" height="100%"></td>
<td width="20" height=""><img src="images/ecran_gauche.jpg" border="0" width="20" height="100%"></td>
<td>
<div STYLE="width: 100%; height: 100%; overflow:-moz-scrollbars-vertical; overflow-y:auto; overflow-x:hide;">
<table border="0" width="100%" height="100%" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr valign="top">
<td>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>
blabla
<br>

</td>
</tr>
<tr><td>&nbsp;</td></tr>
</table>
</div>
</td>
<td width="20" height="100%"><img src="images/ecran_droit.jpg" border="0" width="20" height="100%"></td>
<td width="56" height="100%"><img src="images/rideau_d.jpg" border="0" width="56" height="100%"></td>
</tr>
</table>
<td>
</tr>
<tr valign="bottom">
<td height="68"><!-- bottom --><img src="spacer.gif" height="68" width="100%"></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
 
Nouveau WRInaute
en fait le fichier .css n'a pas d'interaction sur le div, il est juste là pour la mise en page, tout ce qui concerne le div est dans la balise div
 
WRInaute discret
Bonjour,

En supprimant la première table, en suppprimant la première table de la première cellule, en supprimant overflow etc et "-moz-scrollbars", qui n'est pas un standard reconnu je crois. Ta barre disparait.

Le problème ne vient pas du div, mais de la sructure des tables, et aussi pour ff une taille image en absolu ca marche bien.

Et que la force soit avec toi!
 
WRInaute discret
Bonjour,

Le code que tu as listé révèle de nombreuses incohérences que chaque navigateur résout à sa façon. D'ou les résultats variables, sans qu'il soit raisonnable de parler ici de bug pour l'un ou l'autre des navigateurs.

A mon sens le bug se situe plutôt dans le code html lui-même. Par exemple :
- tu as une table supposée faire 100% de son parent (indirectement taille de la fenêtre) et contenant 3 lignes : la première fait au moins 101px (une image enfouie fait 101px), la deuxième fait 90% de la table, la troisième fait 68px. Résultat cette table doit faire à la fois la taille de la fenêtre et 1690px : un peu dur pour le navigateur !
- une autre table contient 2 lignes : la première fait 16px et la seconde 100% de la table (0%=16px ?!!!).
- etc...

Je crois qu'il faut remettre les choses à plat et cesser de torturer les navigateurs.
Ton code est devenu d'une complexité invraisemblable, par l'imbrication des tables. Il me parait presque impossible de le rendre cohérent, d'autant plus que cette complexité est absolument inutile.
Je t'encourage à repartir de zéro, abandonne les tables et utilise le positionnement CSS, c'est à mon avis plus simple, plus précis, plus facile à maintenir pour un code bien plus simple.

Bon courage.
 
Nouveau WRInaute
en fait, j'ai 3 lignes qui font 101, 90% et 68 à l'intérieur d'une table en hauteur 100% qui a une table parent en 100% et une 2eme à 100% également.
A part peut être le 90%, je ne vois pas ce qui est incohérent si je pars d'un 100%. Faut-il partir absolument d'une valeur fixe ? Dans ce cas comment fait on pour que le code de la page s'adapte à toutes les résolutions ? Je suis toujours partie d'une table en hauteur et largeur 100% justement pour que la page s'adapte automatiquement à toutes les résolutions et ça ne m'a jamais posé de problèmes.
 
Discussions similaires
Haut