Nouveau sur le forum ? Voici votre case départ pour bien débuter.

Liens contextuels :

Forum Alsacréations : CSS et Standards Web · CSS et mise en forme · Problème de compatibilité de menu
Rechercher dans le sujet :
Auteur
Azanek
# 08 May 2008 - 19:13:17
Citer
8 Posts
 Bonjour à tous,

Sur mon site, j'ai implémenté un menu que j'ai pris sur les tutoriels d'alsacréations. Je l'ai un peu modifié pour qu'il soit à mon gout mais je suis confronté à un problème que j'arrive pas à résoudre.

En fait, il s'affiche et fonctionne très bien sous firefox. Mais il a un comportement très étrange sous IE et Opera.
Il utilise le scripte " montre " de java

Voici le lien de mon site :
http://www.bistroinvivo.coop/Sitetest2/pagephp/evenements.php

Merci beaucoup pour votre aide.
http://www.bistroinvivo.coop 
^
Akhilleus
# 09 May 2008 - 11:42:58
Citer
59 Posts
 Bonjour,

Il s'agit d'un problème général, pas seulement du menu, la mise en page du site est mise en pièces par IE6.
Il serait plus urgent de régler ce problème avant de se préoccuper du menu cligne

Pour commencer, régler le problème de la transparence sous IE6 :
<!--[if lte IE 6]>

<style type="text/css">

div#global {

	position: relative;

	min-height: 100%;

	width: 930px ;

	padding: 0 10px;

	margin: 0 auto;

	background: url(/Sitetest2/image/structure/fond_global-IE.png) repeat-y;

}

/style>

<! endif -->

où fond_global-IE.png est la même image que fond_global.png, les dégradés en moins.
Modifié par Akhilleus (09 May 2008 - 12:48)
http://www.omicronlab.net/ 
^
Azanek
# 11 May 2008 - 09:29:43
Citer
8 Posts
 Tout d'abords, merci à toi Akhilleus de te pencher sur mon problème ^^

Sinon, je suis sous Vista, et il ne veut pas que j'installe IE6. Donc ça va être difficile pour moi de voir le résultat. Cependant, je devrais avoir accès a un autre ordi avec IE6 donc on va essayer comme ça.

Autre chose, j'ai du mal à voir où intégrer le code que tu m'as donné car il chamboule toute ma balise style. Ici tu remarquera que je suis autodidacte en conception donc j'ai surement quelques lacunes de base.

@ suivre.
http://www.bistroinvivo.coop 
^
6l20
# 11 May 2008 - 17:38:05
Citer
Chasseur de 1/2 Kiwiz
Modérateur
838 Posts
 Bonjour Azanek,

Azanek a écrit :

Sinon, je suis sous Vista, et il ne veut pas que j'installe IE6. Donc ça va être difficile pour moi de voir le résultat. Cependant, je devrais avoir accès a un autre ordi avec IE6 donc on va essayer comme ça.

La FAQ ou ce sujet devraient te donner quelques pistes pour tester tes productions sur divers navigateurs cligne

Azanek a écrit :
Autre chose, j'ai du mal à voir où intégrer le code que tu m'as donné car il chamboule toute ma balise style. Ici tu remarquera que je suis autodidacte en conception donc j'ai surement quelques lacunes de base.

En général au même endroit où tu places ton ou tes appels de feuille(s) de styles entre les balises <head></head>, tu peux également faire une feuille de styles externe, spécifique à un navigateur cible et y faire appel, toujours au même endroit, et toujours via ces commentaires :


<!--[if lt IE 7]>

<link type="text/css" rel="stylesheet" href="styles-ie.css" />

<![ endif]-->

Quelques explications dans la FAQ et sur l'estimable site de Laurent Denis cligne

Cdt,
Sylvain
Modifié par 6l20 (13 May 2008 - 23:19)
XHTML: structure. CSS: présentation. Javascript: comportement.
^
Azanek
# 13 May 2008 - 20:35:51
Citer
8 Posts
 Y a un truc que je comprends pas je pense.

Dans la FAQ, on me dit que les commentaires conditionnels ne peuvent contenir que du (X)HTML. Hors tu me demandes de le mettre entre les balise <head></head>. Est ce que je devrais pas plutôt le mettre dans le body ?

Parce que après avoir ajouter le code, IE6 charge toujours la même image.

Ou bien, j'ai rien compris a tout ça ^^
http://www.bistroinvivo.coop 
^
6l20
# 13 May 2008 - 21:52:16
Citer
Chasseur de 1/2 Kiwiz
Modérateur
838 Posts
 Bonsoir,

En général une page (x)html/css se compose de la sorte :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title></title>

<link rel="stylesheet" type="text/css" media="screen" href="style.css" />	

</head>

<body>



<!-- Contenu du document -->



</body>

</html>


Tu peux comme tu l'as fait sur ta page mettre tes déclarations directement entre les balises appropriées :


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">



<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title></title>

<style type="text/css" media="screen">

Tes déclarations

</style>	

</head>

<body>



<!-- Contenu du document -->



</body>

</html>

Tu peux, comme nous te l'avons suggérer, inclure une feuille de style qui ciblera un navigateur spécifique (en l'occurence ici IE6 ) ce qui donnera :



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title></title>

<style type="text/css" media="screen">

Tes déclarations

</style>	

<!--[if lt IE 7]>

<style type="text/css">

tes déclarations

</style>

ou l'appel d'une feuille de styles externe

<link type="text/css" rel="stylesheet" href="styles-ie.css" />

<![ endif]--> (sans espace après les crochets ouvrants)

</head>

<body>



<!-- Contenu du document -->



</body>

</html>


Pour répondre à ta question, comme tu as pu le lire dans la FAQ :
Techniquement, il s'agit de simples commentaires HTML, qui seront compris comme tels par la plupart des navigateurs. Cependant, le contenu de ces commentaires a une syntaxe spéciale, qui permet à Internet Explorer de savoir s'il doit interpréter le contenu du commentaire ou bien l'ignorer.

Donc, je te confirme qu'il a certainement quelque chose que tu as mal compris, le commentaire conditionnel ne contient que du (x)html, et le fait de le placer entre tes balises <head> (la place qui lui est dévolue) n'y change rien smile

Je t'encourage à regarder ton code source, à vérifier s'il ressemble à cela (un indice, la réponse n'est pas oui... cligne ).
Refait une passe sur tes inclusions PHP, ce n'est pas au point, le commentaire avant la déclaration de Doctype, fera passer IE en mode quirks ce qui n'est pas sans poser problème cligne

Cdt,
Sylvain
Modifié par 6l20 (13 May 2008 - 23:20)
XHTML: structure. CSS: présentation. Javascript: comportement.
^
Azanek
# 13 May 2008 - 22:24:50
Citer
8 Posts
 Ok, je vais voir tout ça et je vous reviens bientôt.
http://www.bistroinvivo.coop 
^
Azanek
# 21 May 2008 - 22:33:47
Citer
8 Posts
 Me revoilà.

Donc j'ai fait les modifs suivantes :

J'ai créé une page pour le commentaire conditionnel de IE et j'ai fait un lien dans le head entre les balise IF comme indiqué.
J'ai enlevé la première note avant l'inclusion du doctype pour éviter le passage en Quirck d'IE.
J'ai fait une deuxième image de fond sans transparence pour IE.

Tout cela a réglé certains problèmes. Mais il en reste encore.

Sous IE :
- Le menu de navigation réagit toujours bizarrement.
- La page occupe pas 100% de la hauteur.
- Un truc bizarre est apparu sur mon menu de gauche ou le dernier caractère du dernier lien est recopier en dessous.

J'aurais aussi une question : y a-t-il moyen de faire comprendre le transparent a IE6 ou il faut que je refasse chacune de mes images avec un fond de la couleur du background ?

Merci beaucoup pour vos prochains commentaires.
Modifié par Azanek (21 May 2008 - 22:35)
http://www.bistroinvivo.coop 
^
Azanek
# 05 Jun 2008 - 20:02:04
Citer
8 Posts
 Je sais pas trop si c'est permis, mais comme ça fait plus de deux semaines que j'ai posté, je prend l'initiative de remonter mon sujet ^^
Modifié par Azanek (05 Jun 2008 - 20:02)
http://www.bistroinvivo.coop 
^
Prévenir un modérateur
Répondre au sujet
Aller à

référencesLes références web : openweb.eu.org - opquast.com - webmaster-hub.com - webrankinfo.com - salemioche.net - web-pour-tous.org - webonorme.org

Nos partenaires : Editions Eyrolles - Location vacances France - Location vacances Europe

Nikozen : Hébergement - Réalisation : Alsacreations.fr

Powered by Phedio v3.7.9 © dew
Contacter l'administrateur - 14.9 ms - Charte