CSS Centrer le design [error]

Fermé
akyrion3000 Messages postés 542 Date d'inscription dimanche 5 juin 2005 Statut Membre Dernière intervention 16 janvier 2010 - 30 avril 2007 à 00:33
 ttaki2004 - 9 avril 2008 à 22:58
Bonjour,

Je fais appelle à vous car je n'arrive désepérement pas à centrer mon thème, je dois faire une *~#{ quelque part.

<!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" >
<head>
<title>HHP</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="description site" />
<meta name="keywords" content="ici, mots, clefs" />
<meta name="author" content="nom" />
<meta name="category" content="internet" />
<meta name="robots" content="index, follow" />
<meta http-equiv="Content-Language" content="fr-FR" />

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

<div id="conteneur">
<h1 id="header">HappyHoursParis.com</h1>

<!--Menu-->

<div id="menu">
<ul>
<li><a href="index.php?page=edito">Accueil</a></li>
<li><a href="index.php?page=recherche">Recherche</a></li>
<li><a href="index.php?page=annuaire">Annuaire</a></li>
<li><a href="index.php?page=ccoeur">Coups de Coeur</a></li>
<li><a href='connection_user.php' onclick='window.open(this.href);return false;'>Propriétaires</a></li>
<li><a href="index.php?page=contact">Contact</a></li>
</ul>

</div>
<!-- Le corps -->

<div id="corps">
	<?php	
//Page par défaut Edito	
				If (empty($_GET['page']))
					{
					$page="edito";
					}
				Else ($page=$_GET['page']);
//accès à la page de recherche
				   if ($page=="recherche")
                   {
                   include ("page_recherche.php");
				   }
//Annuaire
					elseif ($page=="annuaire")
                   {
                   include ("page_annuaire.php");
				   }
//affichage des infos d'un Etablissement
					elseif ($page=="affichage_etablissement")
                   {
                   include ("affichage_etablissement.php");
                  }
//Traitement des recherches
					elseif ($page=="validation_recherche")
                   {
                   include ("validation_recherche.php");
				   }
//Résultats recherches
				   elseif( !empty($_POST['resultat']) && $_POST['resultat'] == "resultat") 
				   {
				   //affichage résultats
				   include ("validation_recherche.php");
				   }
//lien page d'acceuil				 
				   	elseif ($page=="edito")
					{
					include ("edito.php");
					}
//lien page coups de coeur
					elseif ($page=="ccoeur")
                   {
                   include ("ccoeur.php");
                  }
//lien page contact
					elseif ($page=="contact")
                   {
                   include ("page_contact.php");
                  }
			?>   

</div>
	   


<p id="footer">Design by aka-Kun @ HappyHoursParis.com - Tous droits réservés 2007/2008</p>
 
</div>
</body>
</html>


body {
	position:relative;
	background:#000000 url(images/fond.gif) repeat-x;
	width:885px; 
	margin:auto;
	font-size:12px;
	font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;
	text-align:justify;
	color:#CC9966;
	}
div#menu {
	width: 100%;
	height: 50px;
	background: url(images/menuline.gif) no-repeat top center;
	text-align: center;
       }

div#menu ul {
	width: 800px;
	margin: 0 auto;
	padding: 0 0 0 25px !important;
	}
div#menu li {
	float: left;
	list-style: none;
}
div#menu li a {
	display: block;
	width: 133px;
	height: 50px;
	line-height: 50px;
	color: #FFCC33;
	font-weight: ;
	text-decoration: none;
	margin-left: 0 !important;
	margin-left: -5px;
}
       }

div#corps {
	float:right;
	width:500px;
	margin-left : 0px;
    margin-right: 0px;
	height:100%;
	padding-right:125px;
	}

h1#header {
	width:885px;
	height:178px;
	background-image:url(images/header.gif);
	text-indent:-9000px;
	margin-top:0px;
	}

p#footer {
	width:885px;
	height:10px;
	margin-bottom:0;
	clear:both;
	color:#939393;
	text-align:center;
}

#conteneur {
    margin:auto;
	background-image:url(images/corp.gif);
	background-repeat:repeat-y;
	width:885px;
	}*/
	
/*mise en page */	
h2{font-size:13px;border-bottom: 1px dotted #969696;}
a{color:#CC9966;text-decoration:none;}
a:hover{border-bottom: 1px dotted #CC9966}
a:visited{text-decoration:none;}

/*Tableaux*/
caption /* Titre du tableau */
{
   margin: right;
   font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;
   font-weight: bold;
   font-size: 1.2em;
   color: #FFFFFF;
   margin-bottom: 20px; /* Pour éviter que le titre ne soit trop collé au tableau en-dessous */
}
table /* Le tableau en lui-même */
{
   margin: auto; /* Centre le tableau */
   border: 1px outset #FFFFFF; /* Bordure du tableau avec effet 3D (outset) */
   border-collapse: collapse; /* Colle les bordures entre elles */
}

th /* Les cellules d'en-tête */
{
   background-color: #000000;
   font-weight: bold
   color: white;
   text-align: justify;
   font-size: 1.1em;
   font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;
}

td /* Les cellules normales */
{
   border: 1px solid black;
   font-family: "Comic Sans MS", "Trebuchet MS", Times, "Times New Roman", serif;
   text-align: justify; 
   padding: 0px; /* Petite marge intérieure aux cellules pour éviter que le texte touche les bordures */
}

/* Tableau des photos*/
table1 /* pas de bordure */
{
   margin: auto; /* Centre le tableau */
   border-collapse: collapse; /* Colle les bordures entre elles */
}


snif merci :)

3 réponses

Gihef Messages postés 5150 Date d'inscription mercredi 20 juillet 2005 Statut Contributeur Dernière intervention 20 février 2023 2 775
30 avril 2007 à 01:12
Bonjour,

Indépendamment de ton problème, on peut constater 5 erreurs dans ta feuille de styles :
div#menu li a {
	display: block;
	width: 133px;
	height: 50px;
	line-height: 50px;
	color: #FFCC33;
	font-weight: manque qqch;
	text-decoration: none;
	margin-left: 0 !important;
	margin-left: -5px;
}   en trop
       }

#conteneur {
    margin:auto;
	background-image:url(images/corp.gif);
	background-repeat:repeat-y;
	width:885px;
	}*/    en trop

caption /* Titre du tableau */
{
   margin: right;    ne correspond à rien

th /* Les cellules d'en-tête */
{
   background-color: #000000;
   font-weight: bold    manque  ; 

Chez moi, le centrage se fait, mais il manque peut-être encore cette incongruité chère à IE ?
Essaye en remplaçant le “text-align:justify;” par un “text-align : center;” dans le “body {” et rétablis le “text-align:justify;” dans le “#conteneur {”.

+ Vois http://jigsaw.w3.org/css-validator/
et http://validator.w3.org/
2
akyrion3000 Messages postés 542 Date d'inscription dimanche 5 juin 2005 Statut Membre Dernière intervention 16 janvier 2010 165
30 avril 2007 à 17:23
Merci j'ai corrigé ça

Cela fonctionne sous FFox mais pas sous IE :'(
0
dans conteneur
margin-left : auto;
margin-right : auto;
0
Bonjour,
J'ai placé une bannière en haut de ma page d'accueil et j'arrive pas centrer celle ci.

Exemple : https://cv-suspension-dd24.key-systems.net/
Merci pour votre aide.
0