Centrer une page ?

albert
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 458
Inscription: 27 Aoû 2003

Centrer une page ?

Message le Ven Fév 29, 2008 23:50

Voilà, je viens de m'acheter un écran 22'' et je me rend compte que pour ceux qui ont une résolution élevée, mon site est mal conçu.

Je voudrais donc que l'ensemble de la page soit centrée au lieu d'avoir le tout de collé à gauche. Comment faire ? (c'est le site de mon www).
A noter qu'il me faudrait les détails car je suis pas doué en html et encore moins avec les css...

Merci pour votre aide.


mikaelka
Nouveau WRInaute
Nouveau WRInaute
 
Messages: 30
Inscription: 24 Déc 2007

Message le Sam Mar 01, 2008 0:15

il faut que les bord soit en auto dans ton css pour ton conteneur.

Dans le .css :

madiv{
margin-left: auto;
margin-right: auto;
}

albert
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 458
Inscription: 27 Aoû 2003

Message le Sam Mar 01, 2008 0:22

-> Mikaelka Désolé mais je ne vois pas à quel niveau le placer le madiv{....


Koidirou
WRInaute discret
WRInaute discret
 
Messages: 52
Inscription: 3 Mai 2007

Message le Sam Mar 01, 2008 0:49

body {
margin:auto;
}

albert
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 458
Inscription: 27 Aoû 2003

Message le Sam Mar 01, 2008 9:46

Ca ne donne rien, en fait je ne sais pas ou le placer ou ce que celà doit remplacer...


UsagiYojimbo
WRInaute accro
WRInaute accro
 
Messages: 8300
Inscription: 23 Nov 2005

Message le Sam Mar 01, 2008 9:49

Soit dans une feuille de style externe, soit entre des balises <style></style> dans ta page.


athoms
WRInaute discret
WRInaute discret
 
Messages: 244
Inscription: 22 Avr 2004

Message le Sam Mar 01, 2008 10:06

Pas du tout conforme aux standards, mais permet souvent de résoudre des petits problèmes de ce genre...
<center></center> entre <body>et </body>. C'est sale mais ça marche assez bien :)

albert
WRInaute occasionnel
WRInaute occasionnel
 
Messages: 458
Inscription: 27 Aoû 2003

Message le Sam Mar 01, 2008 12:48

-> athoms : le résultat est le meilleur obtenu mais il reste plusieurs éléments qui sont pas centrés comme la partie en haut de page ...


mikaelka
Nouveau WRInaute
Nouveau WRInaute
 
Messages: 30
Inscription: 24 Déc 2007

Message le Sam Mar 01, 2008 18:32

Si ces éléments dont tu parle sont bien dans le bloc qui est centré alors peut être qu'il sont en "position : absolute;" au lieu de "position : relative;".

exemple :
monElementPasCentré
{
position : relative;
}

Ces détails sont à placer aussi dans ton fichier css.


deepo
Nouveau WRInaute
Nouveau WRInaute
 
Messages: 25
Inscription: 5 Juin 2007

I love css

Message le Sam Mar 01, 2008 18:37

Salut Albert,

Dans un premier temps, tu devrais consulter l'excellent site d'Alsacréations.

Ceci étant, et pour t'éviter le déplacement :) voici ce que tu peux faire.

juste après ta balise <body> tu ouvre un <div> que tu appelle comme tu veux, par exemple : <div id="global">

La dedans tu mets tout ton site

</div>
n'oublie pas de refermer le <div> juste avant </body>

et dans la feuille de style tu donne ces propriétés à ton div "global"

Code: Tout sélectionner
#global {
   margin: 0 auto; /* ou margin: 0 auto 0 auto; correspondant à tes marges dans le sens des aiguilles d'une montre, soit : haute droite basse gauche.*/
  padding: 0; /* marge intérieure */
  width: 1000px; /* cette largeur est un exemple mais tu dois en mettre une si tu veux que le margin auto fonctionne. */
}


Le fait de donner une largeur fixe va peut-être de causer quelques soucis avec tes éléments intérieurs surtout si tu leur à donner une largeur à eux aussi, mais c'est un début de réponse.

Bon courage
a{++}


Pandore
WRInaute passionné
WRInaute passionné
 
Messages: 1441
Inscription: 14 Oct 2005

Message le Sam Mar 01, 2008 19:32

mikaelka a écrit:il faut que les bord soit en auto dans ton css pour ton conteneur.

Dans le .css :

madiv{
margin-left: auto;
margin-right: auto;
}

Koidirou a écrit:body {
margin:auto;
}

Aucune chance que ça marche. Il faut impérativement spécifier la largeur du conteneur, si on veut utiliser la valeur "auto". :wink:


Si vous avez aimé cette discussion, partagez-la sur vos réseaux sociaux préférés :

Lectures recommandées sur ce thème :



Qui est en ligne

Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités