Wie man den Inhalt einer Webseite-stick in der Mitte?

In HTML, wie machen Sie es so, dass die site ist ~60-80% des Bildschirm breit, und wenn das Fenster größer ist, als die, die es Zentren, sonst gibt ' s ein scroll-bar? Ich spreche über die Art und Weise ist für die Inhalte hier bei StackOverflow.

Habe ich versucht, aber ist fehlgeschlagen:

<html>
<head>
<style type="text/css">

</style>
</head>

<body>
<center>
<div style="width: 60em; align: center;">kdsjlglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgkhlglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgklglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgklglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgklglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgklglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgklglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgklglkdfjgolksdjflgojsdfsdoljfglsdfghsdkjfgkdhfgkkjdghkdsfjgksdjfhg</div>
</center>
</body>

</html>
InformationsquelleAutor DarkLightA | 2010-12-20
  1. 4

    Hier ist die, die ich immer Folgen:

    <body>
    <div class="wrapper">
        your content
    </div>
</body>

    Und dann in CSS,

    body{text-align:center;}
.wrapper{width:80%;margin:0 auto;text-align:left;}
    • Werfen Sie in eine text-align:left; in .wrapper-wenn nötig und Sie sind gold mit dieser - alle anderen Antworten sind nur verschiedene Geschmacksrichtungen von diesen 🙂
    • DANKE! Das ist genau das was ich brauchte.
    • Eigentlich fand ich, dass 60em war richtig, nicht 80%.
    • Legen Sie die min-width-Eigenschaft, so dass, wenn der browser ist klein, der Inhalt aufhört zu schrumpfen.
    InformationsquelleAutor Veera
  2. 2

    Du willst auto-margins...

    <body>
  <div id="content">
    Your page content here...
  </div>
</body>

    CSS sollte so etwas haben...

    #content { width: 60%; margin: 0 auto 0 auto; }

    Die Bestellung für die Margen (und Polsterung ist das gleiche) ist oben rechts unten Links. Oder Sie können eine Verknüpfung mit. 

    #content { width: 60%; margin: 0 auto; }

    Dies bedeutet, dass oben und unten haben 0 margin; Links und rechts wird die automatische Marge.

    InformationsquelleAutor Jarrett Meyer
  3. 1
    InformationsquelleAutor Quentin
  4. 1

    Kleben Sie den Inhalt in ein div, und legen Sie die rechten und linken Rand auf "auto", etwa so:

    CSS:

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

    HTML:

    <body>
 <div id="content">
 fjkgjkg etc.
 </div>
</body>
    • Das div nicht gefloatet, noch muss Sie sein.
    • Absolut richtig. Brainfart meinerseits.
    InformationsquelleAutor Henrik
Schreibe einen Kommentar