• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

objekt zentrieren

Status
Für weitere Antworten geschlossen.
S

sunflexm

Neues Mitglied
hallo,

ich habe ein html div cantainer der wie folgt deklariert ist.

<div id="main"></div>

in der css datei steht folgendes.

#main {
background-color:#244A8A;
height:50px;
width:800px;
}

mit welchem css befehl kann ich diese box genau zentral ausrichten. habe es mit margin-left und right probiert aber krieg das nicht wirklich hin.
 
css datei :

body {
background-color:#DFDFDF;
margin: 0 auto;
}

#main {
background-color:#244A8A;
height:50px;
width:800px;
}

index.html

<html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<head>
<link rel="stylesheet" type="text/css" href="style/style.css">
</head>
<body>
<div id="main"></div>
</body>
</html>

Objekt ist immer noch an ort und stelle geblieben, nur hat es jetzt keinen 1-2px großen abstand mehr zum oberen sowie linken rand des explorers, mittig ist es aber nicht :(

edit.

beschreibung von css4you.de

Werte: Längenangabe, Prozentangabe, Inherit und auto. Auto weist den Browser an, den Wert automatisch zu berechnen. Das heißt, wenn man zum Beispiel margin: 0 auto; verwendet, wird das Element horizontal zentriert.

habs dem objekt main zugewiesen und nicht body, funzt!

danke danke
 
Zuletzt bearbeitet:
Wenn du deine CSS so aufbaust, Funtioniert dass:
Code: 
body {
background-color:#DFDFDF;
[COLOR=Blue]margin: 0 auto;
[/COLOR][COLOR=Blue]text-align: center;[/COLOR]
}

#main {
background-color:#244A8A;
height:50px;
width:800px;
}
 
ehm... ihr wollt dich den div in die mitte haben also bekommt der auch das

margin: 0px auto;

das sieht dann so aus

Code: 
.center {
    magrin: 0px auto;
    width: 800px;
}

HTML: 
<!-- Head zeuchs -->
<div class="center">Test</div>
<!-- Rest vom body -->
 
Slibbo hat natürlich recht :D Ich war mit meinen gedanken wohl nicht so richtig bei der Sache. Im BODY kannst du das margin weglassen, es genügt, wenn du margin: 0 auto; im #main setzt.
 
MasteR ChieF schrieb:
Es geht doch viel einfacher...


Einfach das Attribut -- float:center; -- setzen und es sollte klappen

Lg MasteR ChieF
Zum Vergrößern anklicken....

bist du dir sicher, dass das funktioniert? also ich denke nicht, das es funktioniert.

Code: 
body {
background-color:#DFDFDF;
[COLOR=Blue]text-align: center;[/COLOR]
}

#main {
background-color:#244A8A;
[COLOR=Blue]margin: 0 auto;[/COLOR]
height:50px;
width:800px;
}
erlaube mir slibbos und nichtsgehts variante korrigiert zu posten:D

ich kenne diese variante als einfachste. natürlich könnte man das center vom body weglassen, dann würden es aber nicht alle browser richtig screenen.
 
Zuletzt bearbeitet:
Also mit --text-align: center;-- bewirkt man nur, das der Inhalt zentriert ist...

und ansonsten schreib alles in eine tabelle und setze im HTML tag <table>
das attribut align="center"!!

dann ist die gesammte Tabelle zentriert, mit divs kann man das nicht so bestimmen, habt ihr recht:D:D:D:D:D

LG MAsteR CHief
 
ich finde es nicht besonders sinnvoll, ein div mit einer tabelle zu zentrieren. mit den divs will man ja auch vom tabellenlayout weg.
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben