28172 sujets

CSS et mise en forme, CSS3

bonjour,

J'essaie de refaire la mise en page d'un petit site. Dans le header, j'affiche un menu basé sur jquery. Mais ... Les sous-menus sont décalés à gauche sous ie8 (je n'ai pas encore testé les version précédentes, ni avec firefox).

J'ai essayé de bidouiller ma feuille de style dans tous les sens, sans succès. Smiley ohwell

Comme je ne veux pas faire un post long comme le bras avec mon code html/css, voici le lien où pouvez voir le problème : http://www.support.lse.fr/pos.html

c'est très moche Smiley confused pour l'instant, mais c'est un simple test !

Merci d'avance pour vos conseils et votre aide ...
Modifié par pols77 (10 Nov 2009 - 19:24)
Bon, je viens de tester sous firefox est ça fonctionne très bien. Mes sous-menus ne sont pas décalés vers la gauche ... Avez-vous des pistes ?

Merci d'avance !
Moi je vois qu'un truc, impose ta loi et dis au gens de DL FF ^^
sinon, je sais pas si ca éxiste, tu fais un détecteur de navigateur et tu les envoies sur la bonne page avec 2 css différents ...

ton lien envoie sur rien
Wamdeus a écrit :
Moi je vois qu'un truc, impose ta loi et dis au gens de DL FF ^^
Et hop adieu les visiteurs qui n'utilisent pas FF (environ 70%, une broutille quoi...), car faut pas rêver ils ne changeront pas de navigateurs pour les beaux yeux d'un webmaster... Smiley rolleyes

Wamdeus a écrit :
sinon, je sais pas si ca éxiste, tu fais un détecteur de navigateur et tu les envoies sur la bonne page avec 2 css différents ...
Tu veux dire utiliser des commentaires conditionnels ? Ca existe, c'est bon mangézan.
C'est vrai que les navigateurs sont casse-pieds, chacuns ont leurs normes etc

mais c'est vrai quand utilisant des commentaires conditionnels ça peut le faire je pense (je sais pas débute encore)

bon courage pour la suite
Wamdeus a écrit :
C'est vrai que les navigateurs sont casse-pieds, chacuns ont leurs normes etc

Quand nescape et IE se disputaient le marché, oui, mais plus maintenant... La norme c'est le W3C et les navigateurs s'efforcent de la suivre, certains sont, par contre, "un peu" à la traine ; mais on ne peu décemment pas dire qu'ils ont pour autant une norme particulière.
Wamdeus a écrit :
Tu parles des nouvelles versions des navigateurs ?

Non. Tous les navigateurs interprètent correctement html et css.
A un niveau plus ou moins avancé et avec plus ou moins de réussite, on est d'accord mais c'est largement suffisant pour que l'on puisse coder pour l'ensemble des navigateurs sans rencontrer de difficulté particulière.

Il y aura parfois quelques instructions rajouter pour s'assurer d'une multi-compatibilté, mais on ne peut pas dire que ce soit un chemin de croix. Après, il y a des différences qu'ils faut accepter (les tailles de font sous Mac par exemple, le non-support des certaines instructions sous ie6, ...) mais ça fait partie du jeu et ça n'est absolument pas bloquant.

Si le site est bien structuré et que les instructions css sont utilisées correctement, le support d'ie6 est du gâteau. Il suffit de faire attention aux "pièges" bien connus et le tour est joué.
Smiley cligne
@Laurie-Anne, Wamdeus et Corinne : J'ai parfaitement conscience que les commentaires conditionnels me permettront d'avoir un affichage correct pour tous les navigateurs. Et je m'attache, pour tous mes essais (très modestes !) à valider mes pages aux standards du W3C ...

Cela dit, je n'ai toujours pas trouvé de solution à mon, problème : Je veux bien mettre tous les commentaires conditionnels nécessaires, mais je ne sait pas comment corriger ce "loup" sous ie8 (et probablement ses ancêtres) ...

De plus, comme un bonheur n'arrive jamais seul, j'ai également un problème d'affichage avec un formulaire (validé avec jquery pour la forme), contrôlé plus tard avec php ...

Sous IE8 (ben tiens !), les labels du formulaires valsent dans tous les sens, en fonction des input qui ont le focus ...

GRUMPH ! Smiley biggol

C'est un fait, sous Firefox l'affichage est nickel... mais je ne peux obliger tous les utilisateurs à utiliser firefox, ce qui à mon avis, serait non seulement une solution de facilité, mais également un mauvais moyen de contournement ...

A tout hasard, je remets le lien corrigé (bah oui, j'avais un peu "fauté" dans le précédent Smiley confused )




Encore une fois, merci d'avance ...
UP !

J'ai le même problème sous IE8 - Fort décalage des sous-menus vers la droite.
J'ai codé une feuille CSS spécifique IE8 (commentaires conditionnels dans mon Head XHTML), mais je ne trouve pas le "truc" pour corriger le décalage dans mon CSS.
Bonsoir à tous,
J'ai résolu le décalage du sous-menu sous IE8 de la façon suivante (avec un commentaire conditionnel). Voici comment j'ai codé mon CSS spécifique à IE (left: 0px;)(text-indent: -2em;) :

#menu
{	width: 170px;
	font: bold 1em Arial, Helvetica, sans-serif;
	list-style-image: url("../images/bullet.png");
	position: absolute;
	left: 0px;
	top: 240px;}

.submenu
{	font: bold 0.8em Arial, Helvetica, sans-serif;
	text-indent: -2em;
	padding: 0.5em;
	list-style-image: none;}