28172 sujets

CSS et mise en forme, CSS3

Centrage dans DIV sous IE

Hello hello !

Je me mets au CSS, DIV et compagnie...
Mais IE ne me facilite pas la tâche...

Sur FF, tout est ok niveau menu.
Sur IE, le div est bien placé mais ma liste est centrée dans le div... et je sais pas pk...

Qqun à une idée ???

Voici le lien:
http://www.speedlife.ch/css

Merci !!!
Voici le code et la feuille de style...

Code HTML

<!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>
		<title>En cours...</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-15" />
		<meta http-equiv="Content-Style-Type" content="text/css" />
		<meta http-equiv="Content-Language" content="fr" />
        <link rel="stylesheet" type="text/css" href="style.css" />
</head>

<body>
	<div id="conteneur">		
		<h1 align="center" id="header"><a href="index.html" title=""><span>CSS</span></a></h1>

		<div align="center">
		  <ul id="menu">
		    <li><a href="index.html">News</a></li>
		    <li><a href="#">A propos</a></li>
		    <li><a href="#">V&eacute;hicules</a></li>

		    <li><a href="#">Pi&egrave;ces</a></li>
		    <li><a href="#">Galerie</a></li>
		    <li><a href="#">Contact</a></li>
	      </ul>
	  </div>
		<div id="contenu">
			<h2 align="center">BLA BLA BLA</h2>

			<p>Rien d'intéressant... voili voilou...</p>
	  </div>
	 <p align="center" id="footer">
     	<h8></a></h8>
     </p>
</div>
</body>
</html>


Feuille CSS

			body
			{
				width:100%;
				min-width:600px;
				margin: 0 0;
				padding: 0 ;
				text-align: center ;
				font: 0.9em "Arial", helvetica, sans-sherif;
				background:#000;
			}
			
			#conteneur
			{	width: 786px;
				margin: 0 auto ;
				text-align: left ;
				background: #fff;
				border: 5px solid #333534;
			}
			
			h1#header
			{
				height: 150px ;
				margin-top: 0;
				background: url(images/bg_site.jpg) repeat-x top left;
			}
			
			h1#header a /*image sur banner*/
			{
				width: 786px ;  /* largeur image titre */
				height: 156px ;   /* hauteur image titre */
				display: block ;
				background: url(images/banner.jpg) no-repeat;
				position: relative;
				top: 0px;
				left: 0px;
				text-indent: -5000px ;
			}		
				
			ul#menu
			{
				height: 0px ;
				margin: 0 ;
				margin-left:-25px;
				padding-top:20px;
				list-style-type: none ;		
			}
			
			ul#menu li
			{

				border: solid 1px #FF0000;
				text-align: left ;

			}
	
			ul#menu li a
			{
				width: 100px ;
				line-height: 20px ; /* hauteur de la ligne */
				font-size: 1em ;
				font-weight: bold ;
				letter-spacing: 3px ; /* espace entre chaque caractère */
				color: #000 ;
				display: block;
				text-decoration: none ; /* décoration du lien */	
			}
	
			ul#menu li a:hover
			{
				
				color: #FF0000;
				background: url(images/puce2.jpg) no-repeat left;
			}
	
			#contenu
			{
				margin-left: 160px;
				margin-right: 350px;
				min-width: 580px;;
				min-height:400px;
				padding-left: 20px;
				border-left: #000 solid 2px;
				text-align: justify;
			}
			
			#contenu h2
			{
				line-height: 27px;
				font-size:15px;
				color: #000;
				text-align:center;
			}
			
			#contenu h3
			{
				border-bottom:1px solid #5b5ea2;
				border-left:3px solid #5b5ea2;
				color: #5b5ea2;
			}
			
			#contenu p
			{
				text-align: left;
				line-height:1em;
				margin-right:0px;
				padding-left:15px;
			}
			
			#contenu a
			{
				color: #FF0000;
				text-decoration:none;
			}
			
			#contenu a:hover
			{
				text-decoration:underline;
			}
			
			p#footer
			{
				margin-top:50px;
				padding-top:10px;
				background:url(images/footer.jpg) repeat-x;
				width:100%;
				height: 8px;
				color:#000;
				font-size:14px;
			}
									
			p#footer a
			{
				color:#ff0000;
				text-decoration:none;
			}
			
			p#footer a:hover
			{
				color: #FF0000;
				text-decoration:underline;
			}
			
			pre
			{
				overflow: auto ;
				background:#f3f3f3;
				border:2px solid #5b5ea2;
				padding: 5px 0 0 5px ;
				font-size: 1.2em ;
			}
			
			pre span
			{
				color: #560 ;
			}
			
			pre span.comment
			{
				color: #b30000 ;
			}
Salut Bladius et bienvenue, Smiley smile

la première chose à faire est de valider ta page (qui contient plusieurs erreurs, notamment à cause de l'utilisation de align="center" qui est obsolète et dans ton cas invalide avec ton DOCTYPE et à cause du H8 puisque la hiérarchie des titres va de H1 à H6).

Pour ce qui est du centrage... voir la FAQ ! Smiley cligne
Sujet clos
Aller à