28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

J'ai un problème d'affichage de mon site sous Safari et Opéra. Il s'affiche correctement avec Firefox, IE6 et même IE7. Mes pages sont validées html et css. Où est le blême et comment corriger le problème?

Exemple de page: ">http://www.eichangins.ch/etudes/hes/hes_f.html
ma feuille de style : ">http://www.eichangins.ch/common/eic.css

Le problème vient sûrement de mon css, je me demande si ça ne vient pas du fait que j'aie mis une marge gauche sur le body, puis d'avoir mis les divs qui comportent le menu en absolute pour IE et fixed pour les autres navigateurs, mais c'est le seul moyen que j'ai trouvé pour que mes pages s'affichent correctement sur Firefox et IE. Sur Opéra et Safari, mon div.fixegauche passe sous le contenu qui se trouve au centre...

Merci pour votre aide
Et en utilisant un padding plutôt qu'un margin sur ton body ?
Voire en mettant padding et margin du body à zéro, et en corrigeant le positionnement des éléments de la page ?

À noter qu'Opera 9.01 ne présente pas de bug de décalage sur le côté gauche, contrairement à Konqueror (et donc sans doute à Safari).

Globalement, la technique employée pour simuler un positionnement fixe, c'est à dire un bloc (classe "content") avec une hauteur fixe et un overflow: auto, pose pas mal de problèmes d'ergonomie, voire tout simplement de rendu.
Ce n'est que mon avis, mais il me semble que cela tient du bricolage (surtout dans l'état actuel de l'implémentation de CSS 2.1), et ce genre de bricolage peut jouer des tours : bugs de rendu, éléments d'interactivité qui ne fonctionnent pas correctement, etc.

Je m'en passerais donc, quitte à ne pas avoir les onglets toujours présents en haut de la fenêtre... ou alors j'utiliserais le positionnement fixe et lui seul (le défilement sera alors le défilement normal de la page), en dégradant ce positionnement fixe en positionnement absolu pour Internet Explorer 6 et inférieur (voir à ce sujet l'utilisation des commentaires conditionnels).
Merci ô grand gourou dickien, le padding à la place du margin résoud le problème de marge gauche sous Safari.

Pour le reste, tu as tout à fait raison, il s'agit d'un bricolage, je suis plus doué pour la dégustation de vins que pour le CSS.
La volonté, lors de la création du site était de n'avoir qu'un bloc qui puisse défiler et le reste de la page fixe. Je n'ai pas trouvé de problème de rendu à l'exception des balises anchor qui ne positionnent pas correctement dans le div.content. J'ai laissé tomber.

Au fait, comment on indique que le problème est résolu?
Bonjour,

Chez moi, sous SeaMonkey (Mozilla) et Firefox, ton contenu n'est pas scrollable.

Le problème de la simulation du positionnement fixed sur IE6 nécessite des bricolages trops "risqués" pour être utilisés en production.

a écrit :
Je m'en passerais donc, quitte à ne pas avoir les onglets toujours présents en haut de la fenêtre... ou alors j'utiliserais le positionnement fixe et lui seul (le défilement sera alors le défilement normal de la page), en dégradant ce positionnement fixe en positionnement absolu pour Internet Explorer 6 et inférieur (voir à ce sujet l'utilisation des commentaires conditionnels).


Florent a raison...

Par ailleurs, utiliser un conteneur scrollable n'est pas non plus une bonne idée : sous Gecko par exemple il faut, pour les utilisateurs de la navigation clavier, tabuler le conteneur pour obtenir le contrôle de l'ascenceur.
Ce qui n'est pas des plus ergonomique.

De manière générale il conviens de laisser l'utilisation des ascenceurs de la fenêtre toujours disponible.

Jean-pierre
Modifié par jpv (19 Sep 2006 - 09:48)
Bonjour,

Réponse à ton message privé :

Seamonkey 1.04, Firefox 1.05

Quoiqu'il en soit, masquer l'ascenseur de la fenêtre n'est jamais une bonne idée, c'est un élément d'interface et nous ne devrions jamais agir sur les éléments de l'interface utilisateur. Smiley smile

Il ne viendrais à personne l'idée saugrenue de masquer les menus du navigateur par exemple... Smiley lol

Pour la barre d'ascenseur c'est la même chose : l'utilisateur doit en conserver le contrôle.

Par exemple, si je regarde ton site en mode fenêtré, je n'ai pas la possibilité d'utiliser l'ascenseur de l'interface et ça c'est anormal.

Jean-pierre
Modifié par jpv (19 Sep 2006 - 11:10)
Bonjour,

Revoyez vous les ascenseurs maintenant ?

Je crois que j'avais juste bugué mon css pour essayer de corriger un petit problème d'affichage sous Opéra, j'ai remis ça en état. Je n'avais pas du tout l'intention de cacher l'ascenseur de mon div de contenu...

Michael