28220 sujets

CSS et mise en forme, CSS3

[RESOLU] Problème Centrage de Site

Bonjour

J'ai voulu faire un bloc div pour centrer mon site.
Mais il ne me semble rien avoir oublié et pourtant ça marche pas.

je vous mets le code .css

body {
	background-color: Black;
	color: White;
}

.centrageauto {
   margin-left:auto;
	margin-right:auto;
	width:800px;
}

.BlochHaut {
	position: relative;
	clear: both;
	background-image: url(header.jpg);
	height: 200px;
	width : 800px;
}
.BlocGauche {
	position: relative;
	float: left;
	clear: left;
	background-image: url(left.jpg);
	height: 800px;
	width: 180px;
}
.BlocCentre {
	position: relative;
	float: left;
	clear: none;
	background-image: url(center.jpg);
	height: 800px;
	width: 440px;
}
.BlocDroit {
	position: relative;
	float: left;
	clear: none;
	background-image: url(right.jpg);
	height: 800px;
	width: 180px;
}


et voici le code HTML

html>
<head>
<title>L'apprenti Webmaster - site pour débutant</title>
<link rel="stylesheet" href="./style/style.css" type="text/css">
    <title>L'apprenti Webmaster - Le site d'entraide des webmasters d&eacute;butants</title>
    <link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div align="centrageauto">
 <div class="BlochHaut"></div>
 <div class="BlocGauche"></div>
 <div class="BlocCentre"></div>
 <div class="BlocDroit"></div>
</div>
</body>
</html>


Lien : Le site
Modifié par NicoTNT (18 Oct 2005 - 16:02)
Essaie en positionnant aussi ton div "centrageauto"
Position: relative;
Modifié par Nigel (13 Oct 2005 - 16:11)
NicoTNT a écrit :
C'est fait

mais hélas toujours pas de changement Smiley confus


Essayes dans ton code html de remplacer:
<div align="centrageauto">

Par:
<div class="centrageauto">

Smiley biggrin
Hum... J'ai tenté de me regarder un peu ton code, mais je ne comprend pas très bien...

Dites-moi, c'est pas les flottants et les clear qui posent problème ?
Je ne sais pas pourquoi, ni ce que j'ai réèllement changer depuis mon premier post, mais maintenant ça fonctionne Smiley biggol

Code HTML :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>L'apprenti Webmaster - site pour débutant</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<div class="CentrageAuto">
 <div class="BlochHaut"></div>
 <div class="BlocGauche"><div class="blocmenu"></div></div>
 <div class="BlocCentre"></div>
 <div class="BlocDroit"></div>
</div>
</body>
</html>


Code CSS :
body {
	background-color: Black;
	color: White;
}

.CentrageAuto {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 800px;
	top: 5px;
	border: 1px solid #000000;
	color: White;
}

.BlochHaut {
	position: relative;
	background-image: url(header.jpg);
	height: 200px;
	width : 800px;
	margin-left:auto;
	margin-right:auto;
}
.BlocGauche {
	position: relative;
	background-image: url(left.jpg);
	height: 800px;
	width: 180px;
	clear: none;
	float: left;
}
.BlocCentre {
	position: relative;
	background-image: url(center.jpg);
	height: 800px;
	width: 440px;
	float: left;
}
.BlocDroit {
	position: relative;
	background-image: url(right.jpg);
	height: 800px;
	width: 180px;
	float: left;
}

.blocmenu {
	width: 180px;
	height: 40px;
	color: White;
	font-family: Arial;
	font-weight: bold;
	font-size: 10pt;
}
Sujet clos
Aller à