CSS Container in der Mitte

Finn

Hey!
Wie kann ich einen CSS Container in die Mitte der Seite stellen? Hab jetzt mehrmals das hier gelesen:

margin: 0 auto

, aber das will bei mir nicht funktionieren

Hallo,

ich bau dafür immer 2 verschachtelte:

<style>
.main {
    width:100%;
    text-align:center;
    text-align:-moz-center;
}
</style>

<div class="main">
  <div>Mitte</div>
</div>

VlG

SideWinder

Nur links-rechts-zentriert oder zusätzlich oben-unten-zentriert?

Jedenfalls: http://www.thestyleworks.de/tut-art/centerblock.shtml

MfG SideWinder

Finn

Ja der Text is ja auch in der Mitte, aber wenn ich das mit einer Backgroundcolor mache(sozusagen mach ich damit ja den Container sichtbar) ist der Container in der Mitte! Ich meine nicht den Text im Container zu zentrieren, sondern den ganzen Container auf der Seite zu zentrieren! (nur horizontal)

Hab ein Beispiel dafür gefunden wies aussehen soll: http://failblog.org/
Das in der Mitte, wo alles drinsteht

inflames2k

Wenn du weist wie breit das DIV ist, kannst du doch Prozentual die Position von links setzen.

Scheppertreiber

Gib dem div eine Breite, dann sollte das funktionieren.

In der Höhe zentrieren ist etwas fummelig, da keiner weiß,
wie lange die Seite ist. Geht die zB über den unteren Browserrand
hinaus kommt das etwas ins Schleudern ...

Scheppertreiber schrieb:

Geht die zB über den unteren Browserrand
hinaus kommt das etwas ins Schleudern ...

Muss es nicht. Mit position:fixed kann man da recht spielen. Dann rutscht der Container beim Scrollen einfach mit.

VlG

Scheppertreiber

fixed hat nur mit Zentrieren nichts zu tun ...

Das ist mir klar! Aber ist das Element erstmal zentriert kann man es mit position:fixed auch beim Scrollen an der zentrierten Position halten -> es scrollt quasi mit...

Damit wollte ich nur auf deine Aussage - es sei kompliziert wenn die Höhe der Seite den unteren Browserrand überschreitet - eingehen!

Finn

Danke. Dann hab ich jetzt noch eine Frage zu den Größen!
Mann kann ja z.B. das hier machen:

#container
{
    width: 100%;
    height: 100%;
}

Aber 100% von was??? Denn dieser Container deckt dann nicht 100% der Seite ab..

Scheppertreiber

Finn schrieb:

Danke. Dann hab ich jetzt noch eine Frage zu den Größen!
Mann kann ja z.B. das hier machen:
#container
{
    width: 100%;
    height: 100%;
}
Aber 100% von was??? Denn dieser Container deckt dann nicht 100% der Seite ab..

Eben. Hängt der Container im <body> und der hat keine konkrete Höhe, dann wird das
halt nichts. width:100% ist für eine div witzlos, es ist ein Blockelement und hat
per default 100%. Mache die width in em oder px.