28173 sujets

CSS et mise en forme, CSS3

Bonsoir, all...

Pour mon site d'ecrits, je suis entrain de créer une nouvelle CSS.
La feuille se nomme 'Writing Plume'.
Pour visionner le dev, c'est ici Smiley langue

L'affichage est correcte sous FireFox, IE6, mais bogue sous Opera, et Konqueror.
Quant à IE 7, je ne comprends pas.
L'identifiant correspondant s'appelle #nav.

Comment je puis régler ces différences d'affichage ?
Est-ce résolvable ?
Modifié par ste (22 Feb 2007 - 18:41)
Bonsoir,
D'après ce que j'ai pu constater, tu as un prologue xml en en-tête de page, avant ton Doctype.

Or, cela pose un certain nombre de problèmes.
Comme tu l'apprendras en lisant ce sujet : Faut-il mettre un prologue XML en XHTML 1.0 strict ?

Je te conseille donc de commencer par le supprimer...
Et de voir les problèmes qui restent par après. Smiley cligne
Modifié par Cygnus (22 Feb 2007 - 19:08)
Bonjour,

Je te remercie pour l'article que j'ai lu avec attention, du moins autant que j'ai pu.
(C'est un article que j'avais loupé, à-priori...)

Nonobstant, mon problème reste entier ... Smiley biggol
Et, je ne vois pas comment le résoudre.
A ce que je vois, personne ne comprend autant que moi le pourquoi du positionnement problèmatique !

Bah, ca m'ennuie quand même... moi qui voulait en faire la nouvelle interface css par defaut. J'en suis loin Smiley rolleyes
ste a écrit :
A ce que je vois, personne ne comprend autant que moi le pourquoi du positionnement problèmatique !

Une piste peut-être : les navigateurs interprètent de manière très variable les styles appliqués à html et body.

Suggestion : déplacer les styles utilisés pour html vers body, et les styles utilisés pour body vers un bloc conteneur global, positionné en relatif si besoin (pour le positionnement correct de ses enfants et descendants positionnés en absolu).
Sauf que ce n'est pas les declarations attribuées dans html qui me posent problème.
(En plus, sincérement, là c'est vraiment un test...)
mais, je veux bien enlever la déclaration html et ses définitions...

Mon problème est bien relatif au menu #nav et son positionnement qui ne se fait pas correctement dans Opera, Konqueror, IE7.

Je teste ta remarque !

Edit : C'est un peu ce que je pensais ... la suppression ne modifie en rien le comportement ; cela aurait pu Smiley langue
Modifié par ste (26 Feb 2007 - 16:42)
Bon, je viens de modifier ma css en ajoutant la déclaration display: block; sur #nav et #nav li ... cela améliore sensiblement le positionnement même dans Konqueror.
Néanmoins, les puces liés à #nav li ont disparu.

Ce qui est étonnant est le résultat du texte relatif à #nav li qui se positionne en-dessous le texte #texte.
Quant à IE 7, le cadre CSS #nav est raccourci.

"Petit-à-petit ..."
ste a écrit :
Néanmoins, les puces liés à #nav li ont disparu.

Ce qui est normal si tu passes les li de l'affichage de type "list-item" (par défaut) à l'affichage de type "block".
Pour IE7, impossible de tester vu que la feuille de style n'est pas prise en compte.

Pour Konqueror 3.5, le rendu semble correct. Sous Firefox 2 et IE 6 également.

Reste Opera, qui a beaucoup de mal avec cette mise en page. Je suppose que tes problèmes viennent principalement de div#top, qui est stylé assez étrangement (positionnement relatif mais sans décalage et venant écraser un positionnement absolu via un hack non interprété par IE6 ? on marche sur la tête...).