Bonjour,
J'aimerais savoir comment on fait pour que mon site soit center avec une marge a droite et gauche ? comme ce site
Merci
Bonjour,
J'aimerais savoir comment on fait pour que mon site soit center avec une marge a droite et gauche ? comme ce site
Merci
bonjour,
2 solutions
seul problème, IE ne reconnait pas le style
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27 <html> <head> <title></title> <style type="text/css"> <!-- .divCentre{ margin: auto; height: 200px; width: 200px; border: 1px solid #AAAAAA; } //--> </style> </head> <body> <div class="divCentre"> ceci est un test </div> </body> </html>
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2margin: auto
- Autre solution
Tu peux définir les marges en pixel également
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26 <html> <head> <title></title> <style type="text/css"> <!-- .divCentre{ margin-left: 20%; margin-right: 20%; margin-top: 0px; margin-bottom: 0px; border: 1px solid #AAAAAA; height: 200px; } //--> </style> </head> <body> <div class="divCentre"> ceci est un test </div> </body>
Bonjour,
Dans la seconde solution IE et Firefox reconaissent ?
Merci
teste le code et tu verras bien...Envoyé par nimois3O
![]()
En mode standard, soit sur IE6 et IE7 avec un doctype complet et correctement renseigné tout en haut de la page, IE interprète correctement le margin:auto.Envoyé par Auteur
Après, si le centrage est vraiment voulu pour les versions inférieures d'IE, on peut toujours ajouter un text-align:center sur le body puis rétablir le centrage à left sur le div centré.
J'ai pris la "seconde solution" ça marche bien sur IE...
J'ai juste un autre "probléme" c'est qhe quand je change de couleur pour qye ma couleur des coté soit différente de la couleur du centre... au centre seul un rectangle change de couleur...
Merci de vos réactions
Je suppose que le probléme se situe du fait que je mets les balise au movais endroit...
HTML
CSS page
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Acceuil</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="generator" content="HAPedit 3.1"> </head> <body bgcolor ="#000000" text="#fffff"> <center><img src="titre.png"></center> <style type="text/css"> @import "page.css"; </style> <div class="divCentre"> <br> <!--.............DEBUT MENU................--> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <meta http-equiv="Content-Language" content="fr" /> <meta name="Robots" content="follow" /> <meta name="MSSmartTagsPreventParsing" content="TRUE" /> <!-- script du menu --> <script type="text/javascript" src="dynMenu.js"></script> <!-- détéction du navigateur --> <script type="text/javascript" src="browserdetect.js"></script> <!-- important pour que les vieux navigateurs ne comprennent pas le CSS --> <style type="text/css"> @import "menu.css"; </style> </head><body> <!-- liste imbriquée de liens qui fera office de menu --> <ul id="menu"> <li><a href="page.htm">Accueil</a> </li> <li><a href="filmalaffiche.htm" >A l'affiche</a> </li> <li><a href="touslesfilms.htm" >Tous les films</a> <ul> <li><a href="cochonou.htm">Cochonou</a></li> <ul> </ul> <li><a href="pq.htm">PQ</a> </li> </li> </ul> <li><a href="quisommesnous.htm">Qui sommes nous ?</a> </li> <li><a href="contact.htm">Contatct</a> </li> </ul> <script type="text/javascript"> initMenu(); </script> <!--.............FIN MENU................--> <br><br><br><br> <!-- Modifier le style --> <center><span ID="texte" style="font-size:24pt;font-family:arial;"></span> </center> <br> <br> <link rel="stylesheet" media="screen" type="text/css" title="Design" href="page.css" /> <FONT FACE="monospace " SIZE="3" /FONT> <div class="titre"> Presentation </div> <br> <center>Cet espace a été crée pour présenter les films du duo de Poubelle Production. <br><br><br> <div style="text-align:justify;"> La méthode utilisé pour chaque film consiste à utiliser le même principe que les dessins animés : filmer une scène image par image en déplaçant légèrement des objets entre deux images pour quà la projection le spectateur ait lillusion que ces objets bougent par eux-même. Les décors, les musiques et les voix ont été réalisées artisanalement, les noms des personnes ayant participé aux differents films sont cités dans les génériques. </div> </div> </center> </body> </html>
CSS menu
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30 /* ------------------------------------ * CSS mardi 3 avril 2007 17:42:09 HAPedit 3.1.11.111 * ------------------------------------ */ p { color : red; } .divCentre{ margin-left: 10%; margin-right: 10%; margin-top: 0px; margin-bottom: 0px; border: 0px solid #AAAAAA; height: 200px; background-color:green; } .titre { color: #ffffff; font-family: ReSiple; font-size: 50px; background-color: #00ffcc; text-align: center; }Un petit screen pour imager ma demande
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86 /* CSS du menu horizontal, bieler batiste */ .menu{ position:absolute; display:block; margin:0; padding:0; width:1000px; height:120px; margin-left: -2px; margin-top: 20px; } .menu ul{ position:absolute; display:block; width:124px; margin:0; padding:0; } .menu li ul{ visibility:hidden; } .menu li li ul{ position:absolute; margin-left:183px; margin-top:-23px; } .menu li{ list-style:none; width:157px;/*espacement entre les intitulés*/ height:auto; display:inline; display/**/:block; float:none; float/**/:left; margin:0; padding:0; } .menu li li{ display:block; float:none; color: #FF0000; height:25px; } /* correct a little IE bug */ * html .menu li li{ display:inline; } /* possition initaile*/ .menu a{ text-align:center; /*alignement du text*/ background-color: #FFFFFF; /*couleur du fond*/ border:5px #404040 solid; /* bordure (taille, couleur, etat */ color:#000000; /*couleur du text*/ display:block; /*type d'element*/ width:150px; /*longeur (190)*/ text-decoration:none; /* decoration du text*/ padding:2px 0; /*marge interieure*/ margin:1px; /*marge exterieur*/ } /*passage de la sourie*/ .menu a:hover{ background-color: #969696;/*couleur du fond*/ border:5px #404040 solid;/* bordure (taille, couleur, etat */ color: #FFFFFF; /*couleur du text*/ cursor : crosshair; /*type de curseur*/ } /* for a mozilla better display with key nav */ .menu a:focus{ background-color: #aaf; } a.linkOver{ background-color: #eee; }
Une partie de la page web est en orange alors que je voudrais la totaliter de la page de cette couleur sauf les bord droit et gauche...
Merci
PS: Sur le message précédent il y a mon code...![]()
Centrage :
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10 #conteneur { text-align: center; } #centre { margin-left: auto; margin-right: auto; width: 700px; text-align: left; }
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8 <div id="conteneur"> <div id="centre"> CONTENU ... ... </div> </div>
Ok, merci j'éssaye sa ce soir je te tien au courant...
Non, ça n'arrange rien...j'ai toujours ce probléme de centrage et de couleur parciel de la page...
Si quelqu'un pouvais m'aider SVP !!!![]()
Salut,
c'est le noir en dessous du centre orange qui ne te va pas ?
Si c'est ça, essaye de mettre height à 100% dans centre, si ça ne marche toujours pas regarde du coté des marges de body.
les puristes vont hurler ... mais moi je fait un tableau en align=center
Et toc ... ca passe tout seul et c'est W3C :p
Non j'aimerais avoir du noir sur les 2 bande de chaque cote de l'ecrant et le centre de la page en orange...Envoyé par b Oo
![]()
Salut,
le site que tu évoques ne correspond pas à ce que tu veux : page contact. Nous sommes d'accord, non ?
Tu voudrais que cela prenne toute la page, la chose la plus simple est de mettre :
min-height: 800 px;
voir plus.
J'ai trouvé un site qui à un tutoriel qui correspond presque à ce que tu veux, sauf qu'il y a un problème car le pied de page est bien en bas, mais il reste du blanc entre le milieu et le pied de page. Cela est dû au fait que le pied de page est placé en absolute.
Je pourrais te donner le lien, je ne l'ai pas sous la main.
Partager