28172 sujets

CSS et mise en forme, CSS3

Images ne s'affiche pas dans IE !

Pour changer IE le fait à sa manière, je suis entrein de refaire au propre mon HTML/CSS ici http://www.florian-steiner.ch/dev/

Sous firefox c'est nikel aucun problème ! Mais sous IE aucune image ne s'affiche ! (sauf ceux du menu).

Vous savez pourquois.. !? Merci !

CSS

* { margin:0; padding:0; } 

body
{
text-align:center;
}

p
{
color:white;
text-align:left;
padding:10px 10px 30px 15px;
}

#header
{
background:url(../img/bg_header.jpg)center ;
height:200px;
}

#container
{
background:url(../img/bg_container.jpg)center ;
width:100%;
height:697px;
padding:35px 0 0 0;
}

#containercenter
{
width:1000px;
margin:0 auto;
}

#contenu
{
margin:auto;
width:500px;
height:500px;
float:left;
background:url(../img/bg_content.png)center repeat;
}

#droite
{
margin:auto;
width:500px;
height:500px;
float:left;
background:url(../img/bg_content.png)center repeat;
}

#footer
{
background:url(../img/bg_footer.jpg)center;
width:100%;
height:75px;
}

/* MENU */

#menucontainer
{
margin:auto;
width:1000px;
}

ul#menu
{
	margin:0;
	padding:0 0 0 170px;
	list-style-type:none;
	width:auto;
	position:relative;
	display:block;
	height:36px;
	font-size:12px;
	font-weight:bold;
	text-transform:lowercase;
	background:transparent url("../img/menu/bg.jpg") repeat-x top left;
	font-family:"Trebuchet MS",Helvetica,Arial,Verdana,sans-serif;
	border-bottom:1px solid #000000;
	border-top:1px solid #000000;
}

ul#menu li
{
	display:block;
	float:left;
	margin:0;
	pading:0;
}
	
ul#menu li a
{
	display:block;
	float:left;
	color:#999999;
	text-decoration:none;
	font-weight:bold;
	padding:12px 20px 0 20px;
	height:24px;

}
	
ul#menu li a:hover
{	
	color:#FFFFFF;
	background:transparent url("../img/menu/over.jpg") no-repeat top right;	
}


/* MENU */



HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Florian Steiner - Apprenti médiamaticien</title>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
</head>

<body>

	<div id="header"> 
		<div id="menucontainer">
			<ul id="menu">
			<li><a href="#" title="">Home</a></li>
			<li><a href="presentation/index.html" title="">Présentation</a></li>
			<li><a href="entreprise/index.html" title="" >L'entreprise</a></li>
			<li><a href="cours/index.html" title="">Les cours</a></li>
			<li><a href="jeux/index.html" title="">Jeux</a></li>
            <li><a href="liens/index.html" title="">Liens</a></li>
            <li><a href="contact/index.php" title="">Contact</a></li>
			</ul>
        </div>
	</div>
    
    <div id="container">
    	<div id="containercenter">
    		<div id="contenu">
       			<p>Mon contenu ici</p>    
      		</div>
       		<div id="droite">
       	 		Partie droite du site        
        	 </div>
         </div>
    </div>
    
<div id="footer">
    (c) Florian Steiner
    </div>

</body>
</html>
Salut,

Peut-être en mettant un espace juste avant le center ... :
background:url(../img/bg_header.jpg)center

Au lieu de blâmer systématiquement IE ...
Sujet clos
Aller à