Centrer une page

**0ColdZero0** · 21/02/2009, 02h49

Bonjour, j'ai fait un site en html / css mais je ne sais pas comment faire pour le centrer, j'ai utilisé des div pour la mise en page du site, merci d'avance !

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
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">  
<head>  
<link href="style.css" rel="stylesheet" type="text/css" />
	<title>Contactez-moi !</title>  
    	<link rel="stylesheet" href="step1_style.css" type="text/css" media="screen" />  
</head>  
 
<body>  
	<div id="outside_container">  
    	<div id="container">       
 
			<div id="content">
 
        		<div class="column1">
 
            		<h2><span class="Login_Menu">D&Eacute<E>JA INSCRIT?</span></h2>
                	<h3>Connectez-vous maintenant!</h3>
 
                	<p><input name="username" type="text" value="Nom d'utilisateur" size="24"/></p>
                	<span class="Login_Username">Memoriser</span><input name="" type="checkbox" value="">
                	<p><input name="password" type="text" value="Mot de passe" size="24" type="password"/></p>
                	<span class="Login_Password">Mot de passe oubli&eacute<e>?</span><input name="" type="checkbox" value="">
 
            	</div>
 
            <div class="column2">
 
                <h2>tutorials</h2>
 
                <p>Test</p>
 
 
            </div>
			<div style="clear:both"></div>
 
        	</div>
 
 
   		</div>  
	</div>    
</body>  
</html>

**Ethyde** · 21/02/2009, 10h17

Bonjour,

un truc du genre :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
#outside_container {
width: 900px; /* à adapter suivant ton site */
margin: 0 auto;
}

**Alt157** · 21/02/2009, 11h33

Bonjour ,

Petite précision juste au passage... Pour que cela passe sur IE n'oublies pas de rajouter le doctype

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<!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="en" lang="en">  
<head>

Sinon merci à Ethyde, je faisais toujours :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
.centrer
{
  margin : auto;
  padding : auto;
  left : 50%;
}

alors qu'en une ligne c'est fait....donc petite question cela fonctionne sur tous navigateurs ta ligne ? (je n ai testé qu'avec Firefox 3 et IE 7)

Bonne journée

**Ethyde** · 22/02/2009, 15h52

Oui oui pas de problème ça tiens

**Macmillenium** · 22/02/2009, 19h13

Envoyé par Alt157

Petite précision juste au passage... Pour que cela passe sur IE n'oublies pas de rajouter le doctype

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<!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="en" lang="en">  
<head>

C'est pour garantir un affichage cohérent sur tous les navigateurs, pas que IE

Centrer une page

Centrer un élément en CSS

Vue hybride

Discussions similaires

Partager

Partager