div zentrieren funktioniert nicht

[Alada]

hallo, ich versuche eine div-basierte web-page aufzubauen.
in der mitte des monitors soll die 1024-pixel große seite zu sehen sein.
ich habe hier schon viel darüber gelesen, aber es funktioniert bei mir nicht.
hier der aufbau der index - seite:

<div id="DivWrapper" style="text-align:center">

<div id="DivTop"><img id="Rahmen_Top_Grau" src="images/Rahmen-Top-Grau.jpg" width="1024" height="13" alt="" /></div>

<div id="DivLinks"><img id="Links" src="images/Links.jpg" width="142" height="755" alt="" /></div>

<div id="DivBannerTop"><img id="Top" src="images/Top.jpg" width="726" height="83" alt="" /></div>

<div id="DivRechts"><img id="Rechts" src="images/Rechts.jpg" width="156" height="755" alt="" /></div>

<div id="DivBanner"><img id="Banner" src="images/Banner.jpg" width="726" height="144" alt="" /></div>

<div id="DivMain">

und hier der anteil des div.css

body
 {
	text-align: center;
}

#DivWrapper {
	position:relative;
	width:auto;
	height:auto;
	z-index:9;
	top: #F00;
	text-align: center;
	background-position: center;
	vertical-align: middle;
	margin-right: auto;
	margin-left: auto;
	
}


#apDiv2 {
	position:absolute;
	width:707px;
	height:35px;
	z-index:1;
	
	top: 3px;
	
	text-align: center;
}
#DivTop {
	position: absolute;
	left: 10px;
	top: 15px;
	width: 1024px;
	height: 13px;
	z-index: 1;
	line-height: 13px;
}
#DivLinks {
	position: absolute;
	left: 10px;
	top: 28px;
	width: 142px;
	height: 755px;
	z-index: 2;
	vertical-align: middle;
}
#DivBannerTop {
	position: absolute;
	left: 152px;
	top: 28px;
	width: 726px;
	height: 83px;
	z-index: 3;
}
#DivRechts {
	position: absolute;
	left: 878px;
	top: 28px;
	width: 156px;
	height: 755px;
	z-index: 4;
	vertical-align: middle;
}
#DivBanner {
	position: absolute;
	left: 152px;
	top: 111px;
	width: 726px;
	height: 144px;
	z-index: 5;
}
#DivMain {
	position: absolute;
	left: 152px;
	top: 255px;
	width: 716px;
	height: 474px;
	z-index: 6;
	background: url(images/Main.jpg);
	padding-left: 10px;
}
#DivInhalt {
	position: absolute;
	left: 188px;
	top: 0px;
	width: 502px;
	height: 464px;
	z-index: 8;
	padding-left: 10px;
	text-align: justify;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: dotted;
	border-right-style: dotted;
	border-bottom-style: dotted;
	border-left-style: dotted;
	overflow: auto;
	
}
#DivFuss {
	position: absolute;
	left: 152px;
	top: 729px;
	width: 726px;
	height: 71px;
	z-index: 7;
}

wo liegt denn hier der fehler??

 

[Herr_D]

AW: div zentrieren funktioniert nicht

body
 {
	text-align: center;
}

#DivWrapper {
	/* position:relative; fliegt raus! */
	width:44em; /* hier müssen Werte stehen */
	height:auto; /* unnötige Angabe */
        [B]margin: 0 auto;[/B] /* regelt den Abstand
	z-index:9;
	top: #F00;
	text-align: center;
	background-position: center;

}

Wobei dann die absoluten Positionierungen der Tochterdiv nicht mehr funzen...

Die sind wahrscheinlich auch nicht nötig...



Seite wäre gut...


Ich muss jetzt allerdings in den Unterricht

 

[Loupcouloir]

AW: div zentrieren funktioniert nicht

noch als Ergänzung:
die End-Tags </div> für Wrapper und Main nicht vergessen im HTML
LG Loupcouloir

 

[Alada]

AW: div zentrieren funktioniert nicht

Leider funktioniert das immer noch nicht.
Der Wrapper zentriert sich nicht im Monitor.... Hatte es sogar mal mit Tabelle probiert - auch das ging nicht.

 

[Alada]

AW: div zentrieren funktioniert nicht

hier ist ein screen.
kritik über das layout wäre natürlich auch toll. wobei ich den grauen rahmen gelöscht habe.

 

[Bobbes]

AW: div zentrieren funktioniert nicht

#DivWrapper {
    position:relative;
    [B]width:1024px;[/B]
    z-index:9;
    top: #F00;
    text-align: center;
    background-position: center;
    vertical-align: middle;
    [B]margin: 0 auto;[/B]
}

probiers mal so...

<div id="DivWrapper" style="text-align:center">

<div id="DivTop"><img id="Rahmen_Top_Grau" src="http://www.psd-tutorials.de/modules/Forum/images/Rahmen-Top-Grau.jpg" width="1024" height="13" alt="" /></div>

<div id="DivLinks"><img id="Links" src="http://www.psd-tutorials.de/modules/Forum/images/Links.jpg" width="142" height="755" alt="" /></div>

<div id="DivBannerTop"><img id="Top" src="http://www.psd-tutorials.de/modules/Forum/images/Top.jpg" width="726" height="83" alt="" /></div>

<div id="DivRechts"><img id="Rechts" src="http://www.psd-tutorials.de/modules/Forum/images/Rechts.jpg" width="156" height="755" alt="" /></div>

<div id="DivBanner"><img id="Banner" src="http://www.psd-tutorials.de/modules/Forum/images/Banner.jpg" width="726" height="144" alt="" /></div>

<div id="DivMain">


</div>
</div>

und so....

 

[Alada]

AW: div zentrieren funktioniert nicht

hej wie geil, habe einfach divs.css geändert - und jetzt funzt das - danke

 

[Loupcouloir]

AW: div zentrieren funktioniert nicht

Du wolltest Input zum Layout:
- für meinen Geschmack nicht sehr prickelnd, etwas zu flach.
Mein Tipp: grafisch etwas aufpeppen, evt. eine weitere Farbe
- In Header-Grafik Bezug zum Thema "IT" herstellen, weil hier gehts um:
- HW
- SW
- Dienstleistungen
wie wäre es mit Nullen und Einsen statt des Gitters rechts ?

LG Loupcouloir

 

[Alada]

AW: div zentrieren funktioniert nicht

mh... die hautpfarben der firma sind grau und rot.
das bild ist eine eps-datei die ich bei shutterstock gekauft habe, da sind leider keine ebenen dabei - also kann ich da ja leider keine 0en und 1en einbauen, oder?

 

[Alada]

AW: div zentrieren funktioniert nicht



schaut mal so?

 

[Loupcouloir]

AW: div zentrieren funktioniert nicht

schon besser.
Aber was hälst Du davon, eine solche Schmuckgrafik komplett selbst in PS oder AI zu entwerfen ? Dann könntest Du einen Block mit Nullen und Einsen gestalten und den super in der Transformation Verzerren.
Wie man echt tolle Linien-Grafiken hinbekommt hab ich mal in einem Video-Tutorial (Webdesign), ich glaube von Stefan, gesehen. Sollte irgendwo auf dieser Site zu finden sein.
LG Loupcouloir