Comment puis-je positionner une page Web au milieu de l'écran?

Comment puis-je positionner une page Web au milieu de l'écran? comme les pages sur le site Web de stackoverflow? J'écris la page maître de mon site Web et je veux utiliser HTML et CSS pour positionner la page maître au milieu de l'écran et ensuite construire le bloc de positionnement intérieur en utilisant css. Mais je n'arrive pas à visualiser ma page au milieu!Comment puis-je positionner une page Web au milieu de l'écran?

Merci!

Source

2009-03-25 Uince81

Vous pouvez utiliser les marges pour le positionner au centre horizontalement.

Donné le html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head></head> 
    <body> 
    <div id="page"> ... content ... </div> 
    </body> 
</html>

Le CSS peut être aussi simple que:

#page { 
    margin-left:auto; 
    margin-right:auto; 
    width:960px; 
}

Vous devez également vous assurer que vous avez un type de document valide pour que cela fonctionne.

Source

2009-03-25 20:22:09

Vous avez seulement besoin d'un doctype valide pour qu'il soit compris correctement par IE. Cependant, je ne pense pas IE6 comprend les marges automatiques. – strager

Je crois que IE6 comprend les marges automatiques s'il y a un doctype valide présent. Au moins dans la version 6.0.2900.2180.xpsp_xp2_gdr.080814-1233. Wow c'était une bouche pleine. –

@strager: il peut, mais vous devez utiliser un petit hack css où vous alignez le texte: centre le parent (le corps dans ce cas), puis le remettre à text-align: left; sur l'élément que vous voulez centrer. –

-1

Vous pouvez essayer:

<center>

Ceci est plus de texte pour répondre au minimum 30character.

Source

2009-03-25 20:20:45 shsteimer

Aussi cheezy que cette réponse sonne, je dois encore voir un navigateur qui ne fonctionne pas parfaitement bien sur .. –

Question demande CSS, autant que je peux lire. – strager

je suppose que id n'a pas lu complètement la question, et j'ai presque mis quelque chose dans ma réponse en disant que ce n'est pas le plus élégant, ou une solution css. Cela étant dit, cela fonctionnera. – shsteimer

Mettez tout votre contenu dans un récipient et lui donner une marge: 0 auto

Source

2009-03-25 20:21:33 Zac

<div style="width: 800px; margin: 0px auto;"> 
    your content here 
</div>

Cocher cette page si vous voulez Horizonal et alignement vertical: http://www.wpdfd.com/editorial/thebox/deadcentre2.html

Source

2009-03-25 20:22:19

Créer un <div> dans votre <body> comme ceci:

<body> 
<div id="main"> 

<!-- ... --> 

</div> 
</body>

Et ajoutez le CSS suivant:

body { 
    text-align: center; /* IE */ 
} 

#main { 
    margin-left: auto; 
    margin-right: auto; 
    text-align: left; /* IE */ 
    width: XXX;   /* Fill this out. */ 
}

Source

2009-03-25 20:22:22 strager

Merci! Je dois l'utiliser aujourd'hui et cela a fait des merveilles! – Richell

De rien! =] – strager

envelopper tout dans un div avec marge: auto et faire corps ont texte-aligner: centre.

Source

2009-03-25 20:22:24 William

Que le code HTML soit comme suit:

<body> 
    <div class="box">.....</div> 
</body>

Et suivant le code CSS:

.box{ 
    width: 200px; 
    margin: 10px auto; 
}

Le code CSS ci-dessus définir la largeur de 200px pour la div et définira de bas et jusqu'à 10px et la marge de gauche à droite à auto ce qui signifie qu'il va automatiquement ajuster sa position au centre. Le auto garantit que les marges gauche et droite seront définies à la même taille.

Source

2016-10-15 06:31:53

Comment puis-je positionner une page Web au milieu de l'écran?

Répondre

Questions connexes