problème de css sous firefox
12 messages • Page 1 sur 1
Consultez la formation au référencement naturel Google de WebRankInfo / Ranking Metrics
problème de css sous firefox
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 ?

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 ?
-

tom_sawyer - WRInaute accro

- Messages: 1205
- Inscription: Jeu Déc 02, 2004 12:45
Re: problème de css sous firefox
micheleow a écrit:Est ce un bug de firefox ?
tu vas pas te faire des copains
-

ZironeTheCylon - WRInaute occasionnel

- Messages: 219
- Inscription: Ven Aoû 05, 2005 18:56
si tu donnes par l'url, on pourra pas t'aider.
-

LeMulotNocturne - WRInaute passionné

- Messages: 636
- Inscription: Mer Juin 01, 2005 20:46
Re: problème de css sous firefox
micheleow a écrit:Est ce un bug de firefox ou y a-t-il une solution ?
Firefox n'échappe pas plus que IE aux bugs...
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...
Envoi ton url qu'on jette un zieu !
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> </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>
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> </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>
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!
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!
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.
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.
Olivier ne m'en voudrat pas trop si je conseille un autre forum ?
http://forum.alsacreations.com/forum.php
http://forum.alsacreations.com/forum.php
-

thecrazywasher - Nouveau WRInaute
- Messages: 37
- Inscription: Jeu Fév 26, 2004 9:36
Oui laisse tombé les "table" et fait du xhtml et css
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.
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.
12 messages • Page 1 sur 1
Formation recommandée sur ce thème :
Formation Référencement naturel Google : apprenez une méthode efficace pour optimiser à fond le référencement naturel dans Google de façon durable... Formation animée par Olivier Duffez et Fabien Facériès, experts en référencement naturel.
Tous les détails sur le site Ranking Metrics : programme, prix, dates et lieux, inscription en ligne.
Lectures recommandées sur ce thème :
- Afficher le PageRank en entier dans Firefox (barre d'outils Google)
- Google crawle les fichiers CSS
- Les visiteurs de WRI apprécient Firefox
- Comment voir facilement les liens nofollow dans Firefox
- Customize Google (extension Firefox)
- La toolbar pour Firefox de Google
- Firefox et son projet de mesure de trafic des sites web
- La barre d'outils Alexa pour Firefox
- SEO Links (Extension Firefox)
- Les meilleures extensions Firefox pour le référencement
- problème css IE != firefox
- probleme de css entre ie et firefox
- Problème css avec firefox
- Probléme de CSS sur firefox
- Css probleme avec firefox
- Problème CSS : Firefox - Safari OK,Opéra - IE 7 KO
- Problème d'affichage CSS sous Firefox
- [CSS] petit problème DIV sous Firefox
- [CSS] Problème d'alignement sous Firefox (OK avec IE)
- probleme de mise en page css sous firefox , osus IE, tout est ok
- Firefox et CSS!
- [CSS] Je haie Firefox...
- FireFox ne reconnait plus ma css ?
- [CSS résolu] help me - FireFox vs IE
- css et firefox mozilla
Consultez la description détaillée des produits ou services de Google suivants : Google Browser Sync, Google Send to Phone
Qui est en ligne
Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités



le forum