Sujet Précédent Sujet Suivant

Centrer mon site

petitfox -  
Titial69 Messages postés 269 Statut Membre -
Bonjour!

j'ai bien entamé mon tout premier site (presque fini) et malgré mes recherches et tentatives je n'arrive pas à le centrer (horizontalement).
il doit me manquer encore quelques connaissances en css et html...
voici le code de ma page d'accueil (toute simple), quelqu'un pourrait il me dire exactement ce que je dois ajouter?

<html>
<head>
<style>
body {
background-image: url(images/imagedefondindex.jpg);
background-repeat: no-repeat;
background-color: #999999;}
div.photoaccueil {
position: absolute;
height: 510px;
width: 764px;
left: 118px;
top: 140px;}
div.logo {
position: absolute;
height: 50px;
width: 234px;
left: 720px;
top: 70px;}
a:link {tex-decoration:none;}
</style>
</head>
<body>
<div class="photoaccueil"><a href="pages/galerieSP/socialetpolitique.html"><img src="images/F090409_09index.jpg" width="764" height="510" border=0></a></div>
<div class="logo"><a href="index.html"><img src="images/logo-FG.png" width="234" height="50" border="0"></a> </div>
</body>
</html>
Configuration: Windows Vista / Firefox 3.5.8
A voir également:

10 réponses

Réponse 1 / 10
Titial69 Messages postés 269 Statut Membre 20
 
Non, pas comme ca, je te donne un exemple : 

<div id="global">

 <div id="top">
 </div>

 <div id="texte">
 </div>

</div>

#global
{
margin: auto;
}
#logo
{
margin: auto;
}
#texte
{
padding: 5px 5px 5px 5px;
}
1
Réponse 2 / 10
Rikkunter Messages postés 7856 Date d'inscription   Statut Membre Dernière intervention   181
 
Salut,

Dans ton style de body, il faudrait que tu ajoutes 
margin:auto;
0
Réponse 3 / 10
Titial69 Messages postés 269 Statut Membre 20
 
Tu n'a qu'une photo?

Car il faut que ton contenu soit dans une div, et que tu centre cette div, exemple : 
<body>
<div id="content">
blablabla
</div>
</body>


Et dans ton css : 
#content
{
margin: auto;
}
0
Rikkunter Messages postés 7856 Date d'inscription   Statut Membre Dernière intervention   181
 
Ouaip juste pour le container... Autant pour moi.
0
petitfox Messages postés 8 Statut Membre
 
snif, malheureusement ta proposition ne marche pas...
faut il faire quelque chose en plus pour qu'il comprenne bien que tout doit être contenu dans div.content?
0
Réponse 4 / 10
Titial69 Messages postés 269 Statut Membre 20
 
nan tu ne peut pas mettre div .content, c'est soi .content si c'est une class, soit #content si c'est un id.

Mais div .content, il va chercher une class content contenu dans une div, copie le code que je t'ai donné, il marchera
0
petitfox Messages postés 8 Statut Membre
 
moui c'est ce que j'ai fait après avoir mis ça, mais ça ne marche toujours pas.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 10
Titial69 Messages postés 269 Statut Membre 20
 
post ton code en entier stp, ou bien une url
0
petitfox Messages postés 8 Statut Membre
 
voilà le code avec les modif que tu m'as indiqué:
c'est la page la plus simple de mon site, l'accueil avec juste une photo et un lien vers le reste du site

<html>

<head>

<style>

#content {margin: auto;}

body {
background-image: url(images/imagedefondindex.jpg);
background-repeat: no-repeat;
background-color: #999999;
}
div.photoaccueil {
position: absolute;
height: 510px;
width: 764px;
left: 118px;
top: 140px;
}
div.logo {
position: absolute;
height: 50px;
width: 234px;
left: 720px;
top: 70px;
}
a:link {tex-decoration:none;}

</style>


</head>

<body>
<div id="content">

<div class="photoaccueil"><a href="pages/galerieSP/socialetpolitique.html"><img src="images/F090409_09index.jpg" width="764" height="510" border=0></a></div>
<div class="logo"><a href="index.html"><img src="images/logo-FG.png" width="234" height="50" border="0"></a> </div>

</div>
</body>

</html>
0
Réponse 6 / 10
Titial69 Messages postés 269 Statut Membre 20
 
Tu n'a pas de doctype, et avec IE, sans doctype il passe en mode QUIKS je crois, donc il sera automatique aligné à gauche.
0
petitfox Messages postés 8 Statut Membre
 
je sais qu'avec IE c'est complexe, mais même sous mozilla ça marche pas
0
Réponse 7 / 10
Titial69 Messages postés 269 Statut Membre 20
 
D'un autre coté tu ne fait rien pour aidé, tu met des position absolute, ce qui va placé ton div photoaccueil par rapoort au coin gauche de ton navigateur.

En lève ces position: absolute, fait tout ca avec des margin et des padding, sinon jamais il ne sera centré
0
petitfox Messages postés 8 Statut Membre
 
j'ai essayé de changer les positionnements mais le logo se retrouve en dessous de la photo, je ne commprend pas trop...

div.logo {
height: 50px;
width: 234px;
padding-left: 720px;
margin-top: 70px;
}
div.photoaccueil {
height: 510px;
width: 764px;
margin-left: 118px;
padding-top: 140px;
}
0
Réponse 8 / 10
petitfox Messages postés 8 Statut Membre
 
ok. je vais essayer en changeant tout ça.
0
Réponse 9 / 10
Titial69 Messages postés 269 Statut Membre 20
 
C'est normal que le logo se retrouve dessous, puisque tu l'a mis après la photo dans ton html
0
petitfox Messages postés 8 Statut Membre
 
j'avais zappé, en tout cas le site n'est toujours pas centré...

<html>
<head>
<style>
#content {margin: auto;}
body {
background-image: url(images/imagedefondindex.jpg);
background-repeat: no-repeat;
background-color: #999999;}
div.logo {
height: 50px;
width: 234px;
padding-left: 720px;
margin-top: 70px;}
div.photoaccueil {
height: 510px;
width: 764px;
margin-left: 118px;}
a:link {tex-decoration:none;}
</style>
</head>
<body>
<div id="content">
<div class="logo"><a href="index.html"><img src="images/logo-FG.png" width="234" height="50" border="0"></a> </div>
<div class="photoaccueil"><a href="pages/galerieSP/socialetpolitique.html"><img src="images/F090409_09index.jpg" width="764" height="510" border=0></a></div>
</div>
</body>
</html>
0
Réponse 10 / 10
Titial69 Messages postés 269 Statut Membre 20
 
A quoi sert ce code : 

padding-left: 720px;
margin-top: 70px;


Et celui ci : 
margin-left: 118px;
0
petitfox Messages postés 8 Statut Membre
 
à positionner mes div! tu m'as dit que ce serait mieux en les positionnant avec les margin et padding au lieu d'absolute
0

Discussions similaires

Site fiable de contrefaçon
AhmedAMG -
Raymond PENTIER -

2 réponses
Que signifie ''Votre colis est arrivé sur son site de distribution'' ?
jouhry113 -
georges97 -

27 réponses
Sites alternatifs à Vixy, vos solutions
remeleffff -
Damy88 -

6 réponses