PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Div zentrieren?


dasBAUM
04.11.2007, 20:13
Hi,
ich bin noch relativ neu bei HTML, habe aber schon einiges gelernt. Zur Zeit bau ich meine Layouts mit Divtags und definiere diese mit CSS. Aber ich habe ein Problem. Wie richte ich ein DIV-Objekt zentral aus? Wenn ich style="left:50%;" eingebe, dann geht die Definition immer vom 0 Punkt aus, d.h. dass die linke Seite des DIV Objektes in der Mitte ist und nicht die Mitte des Objektes.

Wie bekomme ich die zentral?
Drakes
04.11.2007, 20:19
Probiers mal so.

margin-left: auto;
maring-right: auto;
dasBAUM
04.11.2007, 20:53
Funktioniert nicht:


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

body {
margin:0;
padding:0;
background-color:rgb(0,0,0);
font-family:tahoma;
font-size:10px;
color:white;
}

div {
position:absolute;
border:1px solid #888;
font-family:tahoma;
font-size:10px;
}

#box {
margin-left: auto;
margin-right: auto;
}

</style>
</head>
<body>

<div id="box" style="width:500px; height:500px;">Test</div>

</body>
</html>
Drakes
04.11.2007, 21:00
Wieso positionierst du alle div's absolut?
Milchbox
04.11.2007, 21:01
Versuch mal:


#box {
margin: 0 auto;
}


Mfg Milchbox
dasBAUM
04.11.2007, 21:11
Wieso positionierst du alle div's absolut?

Oh shit.. daran lags, sry ^^

Danke an euch
Niji-chan
05.11.2007, 09:23
http://www.ulf-theis.de/tutorials/xhtml-css-webdesign/css-cascading-style-sheets/div-zentrieren

oder das
Crash-Override
06.11.2007, 19:16
Und wie wäre es mit

left: 50%;
margin-left: -250px;
Sollte eigentlich gehen.
Niji-chan
07.11.2007, 08:15
Und wie wäre es mit

left: 50%;
margin-left: -250px;
Sollte eigentlich gehen.

s. mein Link... :rolleyes:
mitaki
09.11.2007, 15:13
Also nun hört mal,

margin: 0 auto;
zentriert jedes Blockelement mit einer breite ungleich 100%. Dem Blockelement also eine Breite geben!

Dass man text-align im IE für Blockausrichtung verwenden kann stellt nur eine weitere der schier unergründbare Fragen des Webdesigns dar.

Dann:

<html>
<!-- ... -->
Wer keinen Doctype verwendet verdient keine Hilfe.
ive beaten tetris
17.11.2007, 12:56
Wer keinen Doctype verwendet verdient keine Hilfe.

wo wir schon dabei sind: es ist wirklich vorteilhaft von beginn an mit einem documenttype zu starten. andernfalls habt ihr im endeffekt extreme anpassungsprobleme solltet ihr diesen im nachhhinein einfügen wollen.

hier erklährt man euch die vorzüge jedes einzelnen doc types und auch die methode wie man solche einnbindet (http://de.selfhtml.org/html/allgemein/grundgeruest.htm)

ansonsten:

border:1px solid #888;

hexadezimal angaben solltest du auch besser zu sechs stellen ausschreiben weils immer noch browser engines gibt die dreistellig gekürzte bereiche nicht kennen oder falsch interpretieren