Centrer son site
Résolu
Gariig
Messages postés
194
Date d'inscription
Statut
Membre
Dernière intervention
-
monkey_monk Messages postés 641 Date d'inscription Statut Membre Dernière intervention -
monkey_monk Messages postés 641 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
J'utilise les <div> pour mon faire les bloc de mon site. Et je voudrai le centrer au mileur de la page.
Quand je fais <div align="center"> juste apres <body>, ça me centre tous les contenus des tous mes blocs <div>. Or je voudrai centrer l'ensemble de mon site.
Je ne sais pas quoi ajouter pour faire cela dans mon fichier CSS.
Merci de votre aide !
J'utilise les <div> pour mon faire les bloc de mon site. Et je voudrai le centrer au mileur de la page.
Quand je fais <div align="center"> juste apres <body>, ça me centre tous les contenus des tous mes blocs <div>. Or je voudrai centrer l'ensemble de mon site.
Je ne sais pas quoi ajouter pour faire cela dans mon fichier CSS.
Merci de votre aide !
A voir également:
- Centrer son site
- Site de telechargement - Accueil - Outils
- Site comme coco - Accueil - Réseaux sociaux
- Quel site remplace coco - Accueil - Réseaux sociaux
- Site x - Guide
- Site pour vendre des objets d'occasion - Guide
31 réponses
Quand je fais
Body
{
text-align : center;
}
ça me centre tout le texte dans les blocs. Mais mon site reste toutjours a gauche...
Je voudrai centrer mon site au milieu de la page.
Qqun a une idée ?
Merci
Body
{
text-align : center;
}
ça me centre tout le texte dans les blocs. Mais mon site reste toutjours a gauche...
Je voudrai centrer mon site au milieu de la page.
Qqun a une idée ?
Merci
Quand je fais
body
{
margin : auto;
}
ça me colle mon site en haut a gauche de la fenetre sans aucun espace.
Qqun a une autre idée pleaaase ?
Merci !
body
{
margin : auto;
}
ça me colle mon site en haut a gauche de la fenetre sans aucun espace.
Qqun a une autre idée pleaaase ?
Merci !
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Oui ! Je voudrai juste centrer l'ensemble ! voici mon code :
<html>
<head>
<style>
body
{
margin : auto;
}
#conteneur {
position:relative;
float:left;
border-color:black;
border-style: solid;
border-width:2;
font-size: 11px;
font-family: Verdana, Geneva, Arial, sans-serif;
}
#header {
width:600;
height:100;
padding:30;
background-color:#d3ff23;
border-bottom-style:solid;
border-bottom-color:black;
border-bottom-width:2;
}
#colonne {
float:left;
width:140;
height:1000;
padding:10;
background-color:lightblue;
border-right-style:solid;
border-right-color:black;
border-right-width:2;
}
#main {
width:460;
height:1000;
padding:10;
background-color:#ffffff;
float:left;
position:relative;
}
#menu1 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#menu2 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#menu3 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#menu4 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#para {
font-size:24px;
text-decoration: overline;
font-weight:bold;
font-family:verdana;
color:navy;
font-style:italic;
}
#boite1 {
border-style:solid;
border-color:lightblue;
margin-bottom:10;
padding:10;
}
#boite2 {
border-style:solid;
border-color:lightblue;
margin-bottom:10;
padding:10;
} h3 {
color:#000000;
font-family-:Arial;
font-weight:bold;
text-decoration:underline;
}
</style>
</head>
<body>
<div id="conteneur">
<div id="header">
<p id="para">Voici le header</p>
</div>
<div id="colonne">
<div id="menu1">
Accueil
</div>
<div id="menu2">
Photoshop
</div>
<div id="menu3">
Forum
</div>
<div id="menu4">
Liens
</div>
</div>
<div id="main">
<div id="boite1">
<h3>Flash</h3>
Le nom de bibliothèque ne sert qu'à retrouver facilement un clip dans la biblitohèque
Un identifiant permettant d'utiliser un clip dans la bibliothèque directement avec Action Script.
Un identifiant représentant une occurrence d'un clip sur scène.
</div>
<div id="boite2">
<h3>Javascript</h3>
Le nom de bibliothèque ne sert qu'à retrouver facilement un clip dans la biblitohèque
Un identifiant permettant d'utiliser un clip dans la bibliothèque directement avec Action Script.
Un identifiant représentant une occurrence d'un clip sur scène.
</div>
</div>
</div>
</body>
</html>
<html>
<head>
<style>
body
{
margin : auto;
}
#conteneur {
position:relative;
float:left;
border-color:black;
border-style: solid;
border-width:2;
font-size: 11px;
font-family: Verdana, Geneva, Arial, sans-serif;
}
#header {
width:600;
height:100;
padding:30;
background-color:#d3ff23;
border-bottom-style:solid;
border-bottom-color:black;
border-bottom-width:2;
}
#colonne {
float:left;
width:140;
height:1000;
padding:10;
background-color:lightblue;
border-right-style:solid;
border-right-color:black;
border-right-width:2;
}
#main {
width:460;
height:1000;
padding:10;
background-color:#ffffff;
float:left;
position:relative;
}
#menu1 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#menu2 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#menu3 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#menu4 {
float:left;
width:110;
height:20;
padding:10;
background-color:#d3ff23;
border-style: outset;
margin-bottom:10px;
}
#para {
font-size:24px;
text-decoration: overline;
font-weight:bold;
font-family:verdana;
color:navy;
font-style:italic;
}
#boite1 {
border-style:solid;
border-color:lightblue;
margin-bottom:10;
padding:10;
}
#boite2 {
border-style:solid;
border-color:lightblue;
margin-bottom:10;
padding:10;
} h3 {
color:#000000;
font-family-:Arial;
font-weight:bold;
text-decoration:underline;
}
</style>
</head>
<body>
<div id="conteneur">
<div id="header">
<p id="para">Voici le header</p>
</div>
<div id="colonne">
<div id="menu1">
Accueil
</div>
<div id="menu2">
Photoshop
</div>
<div id="menu3">
Forum
</div>
<div id="menu4">
Liens
</div>
</div>
<div id="main">
<div id="boite1">
<h3>Flash</h3>
Le nom de bibliothèque ne sert qu'à retrouver facilement un clip dans la biblitohèque
Un identifiant permettant d'utiliser un clip dans la bibliothèque directement avec Action Script.
Un identifiant représentant une occurrence d'un clip sur scène.
</div>
<div id="boite2">
<h3>Javascript</h3>
Le nom de bibliothèque ne sert qu'à retrouver facilement un clip dans la biblitohèque
Un identifiant permettant d'utiliser un clip dans la bibliothèque directement avec Action Script.
Un identifiant représentant une occurrence d'un clip sur scène.
</div>
</div>
</div>
</body>
</html>
Superstefanou non il marche pas ton code. ça colle mon site dans le coin en haut a gauche ce que tu m a donné... Je voudrai centrer l'ensemble du site moi.
#conteneur { width:600px; height:auto; margin:0 auto; }
Normalement ça devrais déjà être un peu mieux ! :D Non ? ^^
Normalement ça devrais déjà être un peu mieux ! :D Non ? ^^
Monkey ça ne marche pas non plus désolé. Quand je fais ça,
#conteneur { width:600px; height:auto; margin:0 auto; }
ça ne bouge pas du tout !
J ai peut etre mal codé mon site je ne sais pas,
je voudrai juste centrer mon <div id="conteneur">Tout le site est ici !</div>
C'est pas simple :/
#conteneur { width:600px; height:auto; margin:0 auto; }
ça ne bouge pas du tout !
J ai peut etre mal codé mon site je ne sais pas,
je voudrai juste centrer mon <div id="conteneur">Tout le site est ici !</div>
C'est pas simple :/
Ton css est très mauvais... met width:100%; pour body, fixe une largeur à conteneur, enlève le float (pkoi un float ici..) et met-lui encore margin:0 auto.
J ai modifié ma page (code simplifié pour voir l'essentiel)
Je voudrai centrer ma page au milieu mais cela ne marche pas avec margin:0 auto
Que dois je faire ? Merci de votre aide
voici mon code:
<html>
<head>
<style>
body {
margin:0 auto;
width:100%;
}
#conteneur {
width:700;
height:1000;
position:relative;
}
#colonne {
width:200;
height:1000;
float:left;
background-color:blue;
position:relative;
}
#main {
width:500;
height:1000;
float:left;
}
</style>
</head>
<body>
<div id="conteneur">
<div id="colonne">
hello
</div>
<div id="main">
salut
</div>
</div>
</body>
</html>
Je voudrai centrer ma page au milieu mais cela ne marche pas avec margin:0 auto
Que dois je faire ? Merci de votre aide
voici mon code:
<html>
<head>
<style>
body {
margin:0 auto;
width:100%;
}
#conteneur {
width:700;
height:1000;
position:relative;
}
#colonne {
width:200;
height:1000;
float:left;
background-color:blue;
position:relative;
}
#main {
width:500;
height:1000;
float:left;
}
</style>
</head>
<body>
<div id="conteneur">
<div id="colonne">
hello
</div>
<div id="main">
salut
</div>
</div>
</body>
</html>