28173 sujets

CSS et mise en forme, CSS3

Probleme de compatibilité avec IE u_u'

Bonjour a tous,
voila mon probleme:
je souhaite réaliser un menu avec des css, malheuresement il n'est pas compatible avec Internet Explorer et je ne comprends pas pourquoi

peut-être pourrez vous m'éclairer

voila le css

body {
 font: 11px verdana, sans-serif;
 background: #AFA99B url("fond.jpg") top left no-repeat;
 margin: 0;
 padding: 0;
}

/* ------------------------------------------------------------------------------------
Tha Drop-down Menu
------------------------------------------------------------------------------------ */

/* Elements de premier niveau
--------------------------------------*/
#menuDeroulant
{
	background: #6A6458;
	width: 644px;
	height: 21px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	border: 0;
}
#menuDeroulant li
{
	float: left;
	width: 150px;
	margin: 0;
	padding: 0;
	border: 0;
}
#menuDeroulant li a:link, #menuDeroulant li a:visited
{
	display: block;
	height: auto;
	color: #FFF;
	background: #3B4E77;
	margin: 0;
	padding: 4px 8px;
	border-right: 1px solid #fff;
	text-decoration: none;
}
#menuDeroulant li a:hover { background-color: #F2462E; }
#menuDeroulant li a:active { background-color: #5F879D; }

#menuDeroulant .sousMenu
{
	display: none;
	list-style-type: none;
	margin: 0;
	padding: 0;
	border: 0;
}
#menuDeroulant .sousMenu li
{
	float: none;
	margin: 0;
	padding: 0;
	border: 0;
	width: 149px;
	border-top: 1px solid transparent;
	border-right: 1px solid transparent;
}
#menuDeroulant .sousMenu li a:link, #menuDeroulant .sousMenu li a:visited
{
	display: block;
	color: #FFF;
	margin: 0;
	border: 0;
	text-decoration: none;
	background: transparent url("fondTR.png") repeat;
}
#menuDeroulant .sousMenu li a:hover
{
	background-image: none;
	background-color: #F2462E;
}

#menuDeroulant li:hover > .sousMenu { display: block; }


et la page web

<!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="en"><head><title>Testos</title>

	
	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
	<meta name="robots" content="all">
	<link rel="stylesheet" type="text/css" href="menu01test_fichiers/menu01.cs" title="default" media="screen"></head><body>

	<ul id="menuDeroulant">
		<li>
			<a href="#">Les castors</a>
			<ul class="sousMenu">
				<li><a href="#">Pelage doux mais robuste qu'on aime bien beaucoup</a></li>
				<li><a href="#">Ils confectionnent des barrages !</a></li>
				<li><a href="#">Ils ont des grandes dents</a></li>		
			</ul>
		</li>
		<li>
			<a href="#">Partie 2</a>
			<ul class="sousMenu">			      
				<li><a href="#">whisky</a></li>
				<li><a href="#">vodka</a></li>
				<li><a href="#">gin</a></li>
				<li><a href="#">vin</a></li>
				<li><a href="#">champagne</a></li>
			</ul>
		</li>
		<li>
			<a href="#">Partie 3</a>
			<ul class="sousMenu">			      
				<li><a href="#">pommes</a></li>
				<li><a href="#">poires</a></li>
				<li><a href="#">ananas</a></li>
				<li><a href="#">pamplemousse</a></li>
				<li><a href="#">banane</a></li>				
				<li><a href="#">raisins</a></li>
				<li><a href="#">framboises</a></li>
				<li><a href="#">fraises</a></li>
				<li><a href="#">mirabelles</a></li>
				<li><a href="#">groseilles</a></li>
			</ul>
		</li>
		<li>
			<a href="#">Partie 4</a>
			<ul class="sousMenu">			      
				<li><a href="#">tomates</a></li>
				<li><a href="#">haricots</a></li>
				<li><a href="#">carrottes</a></li>
				<li><a href="#">choux</a></li>
				<li><a href="#">concombres</a></li>				
				<li><a href="#">courgettes</a></li>
				<li><a href="#">endives</a></li>
				<li><a href="#">navets</a></li>
				<li><a href="#">epinards</a></li>
				<li><a href="#">avocat</a></li>
			</ul>
		</li>
	</ul>
</body></html>


Merci d'avance
Sujet clos
Aller à