28220 sujets

CSS et mise en forme, CSS3

Compatibilité réticente avec Firefox

Modérateur
Salut tout le monde,

j'essaye actuellement de rendre ma mise en page (adaptée à IE) compatible avec FF. Celle-ci a pour objectif d'être adaptée aux résolutions 800*600 et +... Vous pouvez l'observer à l'adresse suivante:
http://koala64.free.fr/prepa/accueil.htm

Aussi, 2 problèmes importants surviennent lors de ma démarche:

-les dimensions inscrites en % ne fonctionnent pas normalement sous FF ce qui fait "foirer" le redimensionnement de ma présentation dans des résolutions autres que 1280*1024.

-lorsque je mets en place une zone scrollable (cf exemple) je ne peux la faire défiler qu'en cliquant sur la barre de défilement et non avec la molette de ma souris lors du survol...

ex.:

<html>
<head>
<style type="text/css">
#zone { background:#8C8;
            width:300px;
            height:300px;
            overflow:scroll; }
</style>
</head>
<body>
<div id="zone">
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...<br>
vive les gloomiths...
</div>
</body>
</html>

Quelqu'un pourrait-il m'aider?
Merci à d'avance à tous ceux qui me consacreront un peu de temps... Smiley cligne
Modifié par koala64 (10 Apr 2005 - 18:05)
Administrateur
Salut Koala et bienvenue ici.

Pourrais-tu, comme les Règles du forum te le suggèrent, afficher tes exemples correctement, à l'aide des boutons de [ CODE] ?

Merci d'avance d'éditer ton post Smiley smile
Salut,

1) Les dimensions, qu'elles soient indiquées en % ou en px, marchent très bien dans Firefox. 99,99 fois sur 100, c'est IE qui déconne.
2) Ton script de lancement de page redimensionne la fenêtre, ce qui est très désagréable. Si l'utilisateur surfe dans une certaine taille de fenêtre, c'est son choix.
3) Désolé pour les zones scrollable, mais il faudrait que tu en mettes une pour qu'on voie le problème
4) Merci d'éditer ton message et d'utiliser le bouton "code" afin que ton code html (ou autre) soit intégré de manière plus lisible dans ton message.

Conseil de lecture (ça a peut-être un rapport avec ton problème de dimensions) : dimensions de boîtes css

[EDIT]Arf Raphaël m'a grillé de quelques secondes sur le bouton code Smiley murf [/EDIT]
Modifié par Marvin Le Rouge (10 Apr 2005 - 13:50)
Administrateur
Au fait, s'il était possible de corriger les vilaines fautes sur "réticentes" dans le titre Smiley cligne
Modérateur
Salut à tous les deux,

tout d'abord, pardon Raphaël, je n'avais pas pris le temps de lire les règles...
J'ai donc modifié mon post... on ne m'y reprendra plus...

Cher Marvin,

pour répondre à tes remarques:

1) Si tu as essayé de redimensionner ma fenêtre sous IE, tu as du constater que çà ne pose aucun problème aussi bien en hauteur qu'en largeur. En revanche, la même opération sous FF fait passer mon corps de texte sous le menu. Vu que les valeurs des largeurs sont indiquées en % pour ces 2 éléments, çà ne devrait pas être le cas...

2) Comme toi, je suis d'accord que le script de redimensionnement impose une contrainte "insoutenable" à l'utilisateur... J'avais bien prévu de l'enlever... Néanmoins, la mise en page en 1280*1024 sous FF n'est correcte que si ce script est présent donc la suppression attendra...

3) & 4) Pour la zone scrollable, j'avais laissé mon exemple que tu pouvais copier/coller dans ton éditeur de texte favori et sauvegarder en .html mais peut-être que l'omission des balises de code avaient rendu ce message illisible... le mal est maintenant réparé...

Par ailleurs, je te remercie pour le lien vers le dimensionnement de boîtes mais je l'avais consulté avant d'envoyer ce post et celà ne m'aidait malheureusement pas... c'est pourquoi je vous fais part de mes soucis...

PS: IE a, en effet, une manière bien à lui d'interpréter le language css ce qui n'est pas sans causer quelques soucis... Mais la solution est dans les hacks... En revanche, l'étendu des paramètres css accessibles semblent encore être à son avantage... Bref, je ne tiens pas à faire un comparatif, moi ce que je vois c'est qu'avec IE çà marche normalement...

PS2: Oups! Décidemment, je doit être nul en orthographe... enfin, personne n'est à l'abri... (A part çà, comment peut-on modifier le titre?)

Bon, dans tout çà, mes problèmes sont toujours d'actualité... enfin merci quand même pour ton point de vue... Smiley smile

Je laisse à tout hasard le lien vers le fichier css en question:
http://koala64.free.fr/prepa/css/gabarit01.css
Modifié par koala64 (10 Apr 2005 - 18:03)
Administrateur
koala64 a écrit :
(A part çà, comment peut-on modifier le titre?)

Voici comment faire Smiley cligne

Pour tes problèmes de mise en page, as-tu pensé à faire un tour dans la Méthodologie décrite ici ? Elle est en général performante si on prend le temps de la suivre correctement.
Modifié par Raphael (10 Apr 2005 - 16:13)
koala64 a écrit :

PS: IE a, en effet, une manière bien à lui d'interpréter le language css ce qui n'est pas sans causer quelques soucis... Mais la solution est dans les hacks... En revanche, l'étendu des paramètres css accessibles semblent encore être à son avantage... Bref, je ne tiens pas à faire un comparatif, moi ce que je vois c'est qu'avec IE çà marche normalement...


C'est bien là le problème : il est fort possible que tout marche "normalement" sous IE parce que tu as conçu ta feuille css sous IE, donc Anormalement très probablement. En d'autres termes, ça marche bien sous IE, c'est que ça marche mal.

NB : L'étendu des paramètres accessibles est loin d'être à son avantage : il lui manque min-width, min-height, max-width, max-height, une gestion correcte de fixed, et j'en passe. Mais comme tu l'as dit, nous ne sommes pas là pour faire un comparatif.


Je te conseille d'essayer de refaire ta css en te basant sur l'aspect Firefox, puis de corriger les problèmes spécifiques à IE. C'est en général beaucoup plus efficace.
Modérateur
Smiley lol J'attendais une réponse de ce type... pas de comparatifs donc...

Bon, je prends note et je vais suivre vos conseils en essayant cette méthode... qui sait?!

... mmh... celà dit... pour le paramétrage des scrollbars... enfin bref!

PS: J'ai découvert la conception de site web en ce début d'année donc ne m'en voulez pas si cette acharnement envers IE me laisse dubitatif... Moi, je ne demande qu'à être convaincu... Smiley ravi

En tout cas merci à tous les deux... je retourne tailler mes crayons et je m'y remets... Smiley murf
Modifié par koala64 (10 Apr 2005 - 18:49)
Administrateur
koala64 a écrit :
donc ne m'en voulez pas si cette acharnement envers IE me laisse dubitatif...

On ne t'en veux pas.
Je te propose simplement un dernier lien qui me semble plutôt pertinent sur la question Smiley smile
Sujet clos
Aller à