Ne peut pas align <div> centre de

Je suis en train d'aligner un " div " attribut le centre de la page (à l'horizontale). Le problème est que tout ce que les attributs que j'ai utilisé, l' 'div' continue à être aligné à gauche. Le " div " qui je suis se rapportant à, est la page 'div' de la page web, qui est à l'intérieur de la 'html' et le 'corps' attributs. Voici le code CSS:

#page{
    margin-top:20px;
    margin-bottom:20px;
    margin-left: auto;
    margin-right:auto;

    border-color: black;
    border-style: solid;
    border-width: thin;

    overflow:auto;

    padding-bottom: 10px;
    padding-top: 0px;

    width:1200px;
    background-color:#ffffff;
    font-family:Arial, Helvetica, sans-serif;
    color:black;
    font-size:12px;    
    height:700px;
}

et 'html', 'body' code CSS est la suivante:

html,body {
    background-color:#FFFFFF;
    margin-left: auto;
    margin-right: auto;
}

Noter que, si je retire le "dépassement" de la propriété, la div est aligné sur le centre de la page (bien que, il superpose le menu qui est sur le dessus de celui-ci) mais j'ai besoin de le "dépassement" de la propriété pour ajouter automatiquement des barres de défilement si la largeur ou de la hauteur de la page qui sera affiché à l'intérieur de ce div est plus grande que celles spécifiées dans la feuille de style CSS.

Avez-vous essayé "0 auto" au lieu de simplement auto comme paramètre marge?
Montrer votre code dans jsfiddle plz
Oui, j'ai essayé de 0 auto mais ça n'a pas aidé non plus...

OriginalL'auteur Lefteris008 | 2013-05-18

  1. 2

    Je n'ai pas codé quelque chose de temps en temps, cependant, normalement, quand je suis entrain de créer un centré sur la page:

    html, body { width: 100%; height: 100%; margin: 0 auto; text-align: center; }

    Puis pour la div:

    #page { width: 900px; overflow: hidden; text-align: left; margin: 20px 0 20px 0; }

    Qui peut ou peut ne pas fonctionner, comme je l'ai dit, il a été un certain temps.

    OriginalL'auteur Andrew Manson

  2. 1

    Pour margin:auto fonctionne dans votre cas, est nécessaire à la définition d'une largeur/hauteur de conteneurs qui sont le HTML et le CORPS

    IMPORTANT:HTML et des éléments du CORPS doivent être écartées à la largeur/hauteur des propriétés

    Procédez comme suit

    html,body {
    background-color:#FFFFFF;
   width:100%;
    height:100%;
}

    et de regarder ce violon

    OriginalL'auteur Fico

  3. 1

    Il semble que votre div est le remplissage de la pleine largeur de l'écran. Afin d'alignement n'aura pas visible effet sur la div. Essayez d'utiliser un span à la place.

    Suivante ne fonctionnera PAS

    <body style="text-align:center">
  <div>Foo</div>
</body>

    Suivante devrait fonctionner

    <div style="text-align:center">
  <span>Foo</span>
</body>
    Cela fonctionne - aimerait savoir pourquoi!

    OriginalL'auteur

  4. 0

    Simple:

    HTML

    <div id="page"></div>

    CSS

    #page {
  width: 350px; height: 400px; border: 1px solid #000; margin: auto
}

    jsFiddle exemple

    OriginalL'auteur Christian

  5. 0

    Vous pouvez également regarder la "gauche" et "droite" attributs pour le centrage d'un si vous essayez de centrer horizontalement.

    Par exemple, si la largeur est de 60% de la page (largeur:60%), vous pouvez définir (à gauche:20%) et (à droite:20%) qui PEUT centrer, mais cela dépend de la façon dont votre div est positionné. (position:absolute) ou (position:relative).

    (position:absolute) ci-dessus, la largeur, la gauche et la droite devrait centrer horizontalement.

    Il est également <center> enter code </center> dans le code HTML qui a fonctionné pour moi dans le passé.

    Je ne suis pas un gourou avec ce bien, donc je ne sais pas ce que les "meilleures pratiques" à utiliser dans votre cas.

    OriginalL'auteur Aaron Medacco

  6. 0
    <div style="margin:0px auto;">sfsfsafafas</div>

    Utiliser ce code ça sera sûrement faire de la div au centre.

    OriginalL'auteur GaneshKumar