28172 sujets

CSS et mise en forme, CSS3

Commentaires conditionnels IE6

bonjour à tous, je travaille sur un site xhtml et CSS, celui-ci est compatible avec tous les navigateurs récents dont internet explorer 7 et 8.. mais pas IE6 Smiley ohwell

Je dois afficher mon menu en haut de la page. Voici mon code html et CSS :


<ul id="primary-nav">
<li class="menuactive">
<a href="#"><span>Accueil</span></a>
</li>
<li>
<a href="#"><span>Expertise</span></a>
</li>
<li>
<a href="#"><span>Fonctionnement</span></a>
</li>
<li>
<a href="#"><span>Références</span></a>
</li>
<li>
<a href="#"><span>Contact</span></a>
</li>
<li>
<a href="#"><span>A propos</span></a>
</li>
</ul>



#menu dfn{
display:none;
}

#menu{
	margin:0;
	padding:0;
	position:absolute;
	top:-16px;
	right:10px;
	height:30px;
}

#menu ul{
	list-style:none;
}

#menu ul li{
	text-align:center;
	line-height:30px;
	float:left;
        width:125px;
	height:30px;
	margin-right:-8px;
	background:url(images/menu.gif) no-repeat 0 0;
}


#menu ul li:hover{
	background:url(images/menu.png) no-repeat 0 -30px;
}

#menu ul li a{
	margin-top:-1px;
	color:#333;
	display:block;
	text-decoration:none;
	font-size:13px;
	cursor:pointer;
}


Pour que mon menu soit bien positionné, j'ai du lui attribuer une valeur négative à l'attribut top de la div menu.

Sauf que pour IE 6 et 7, cet attribut masquait la moitié du menu.

Solution que j'ai trouvée : le commentaire conditionnel Smiley lol

J'ai donc créé un commentaire conditionnel de type :

<!--[if lte IE 7]>
	<link rel="stylesheet" type="text/css" href="menuIE7.css" />
<![endif]-->


Mais le changement ne s'opère que pour IE7 Smiley decu

Pareil si je dissocie et créé 2 commentaires conditionnels pour les 2.

Alors évidemment je suis tenté de dire aux visiteurs d'actualiser leur version d'IE, mais ce n'est pas dans très correct à mon avis vu qu'il s'agit d'une demande client.

Merci pour votre aide =)
Salut,

As tu bien pensé de mettre cette condition après la feuille de style normale ?^^
Bonjour,

Est-ce que tu aurais une page en ligne à nous montrer ?

Pour IE6, ton menu ne fonctionnera pas, jamais. IE6 n'interprete la pseudo-classe :hover que lorsqu'elle est appliquée à un élément "a".
voici l'adresse du site : http://brandminingconsulting.com

Pour mes tests je tourne avec des versions standalone d'IE (sauf la 8 qui elle est bien en dur). Pour le rollover, je sais que ça ne fonctionnera pas sous IE6, mais c'est pour le moment le positionnement qui me pose problème.

Merci pour votre aide.
dawdy a écrit :
vérifie bien le chemin de ton fichier CSS (essai avec un chemin absolu comme test)

le chemin est bon, puisque c'est le même que pour la condition d'IE7 qui lui fonctionne.
Salut,

Sous IE8, en désactivant le style que tu as mis sur "#menu", le menu remonte et se met à sa place.
Bon, alors en fait je me suis rendu compte qu'IE6 ne réagissait qu'à une condition if IE sans précision de la version. le problème c'est que si je mets simplement

<!--[if IE]>
	<link rel="stylesheet" type="text/css" href="brandmining-menu-ie.css" />
<![endif]-->


La feuille de style s'applique à toutes les versions d'IE. J'ai donc du rajouter

<!--[if !IE 8]>
	<link rel="stylesheet" type="text/css" href="brandmining-menu-ie.css" />
<![endif]-->


pour spécifier à IE8 (qui lui s'affiche nikel) de ne pas prendre en compte cette feuille de style.

Voilà la solution vaut ce qu'elle vaut:/

A quand le jour où microsoft développera des applications respectueuses des standards et où les gens accepteront enfin de mettre IE6 à la corbeille... Smiley rolleyes
Sujet clos
Aller à