div zentrieren vertikal klappt nicht richtig

blueTiger

Habe einige sachen durchgelesen habe es dann auch nach diesen tut versucht.

Klappt aber nur teils, die Seite wird bei meiner Freundin erstmal viel kleiner dargestellt und soweit auch fast mittig. Bei mir ist aber das Problem wenn ich Sie im Dreamweaver bearbeite oder Online aufrufe sehe ich oben nicht ganz den Head Bereich. Hier das Foto für die bessere verständnis:

Nach unten lässt sich scrollen und man sieht den footer Bereich ganz.
Die Homepage wird erst ganz sichtbar mit der richtigen Zentrierung wenn ich im firefox die F11 Taste drücke. Ich Arbeite an einem LCD-HD Fernseher 32 Zoll. Liegt es vielleicht am Fernseher Format das die Seite bei mir so groß dargestellt wird und bei dem Monitor meiner Freundin viel kleiner. Obwohl ich parallel dazu noch einen 19 Zoll Monitor angeschlossen habe und der mir das in der gleichen größe darstellt???

Hier die Homepage dann könnt ihr genau sehen wie groß Sie bei eich ausfällt und ob der Head Bereich fehlt.

Die CSS Anweisung:

#wrapper{
background-image:url(../pictures/wrapper-top.jpg) no-repeat;
background-color:#fae8fb;
position:absolute;
left:50%;
top:50%;
height:630px;
width:663px;
margin:-315px 0px 0px -332px;

sejuma

Versuch's mal so:

Code

#wrapper{
	background: #fae8fb url(../pictures/wrapper-top.jpg) no-repeat;
	position:absolute;
        ....

Größenunterschiede kann ich im FF und IE nicht feststellen.

blueTiger

ja und was bring mir das position:absolute; ohne genaue Angaben zur Positionierung. Das ist doch alles oben links im Eck, hast du dir das Foto angeschaut das ich gemacht habe da ist ja oben im Head bereich ein Teil nicht sichtbar und die Seite wird bei mir groß dargestellt. Siehst du die Homepage mittig und klein oder wird es bei dir ganz groß dargestellt?

sejuma

Es geht nicht um position absolute, sondern darum, dass du auf background-color verzichtest und den farbcode in background schreibst.

blueTiger

Ok aber ich verstehe immer noch nicht was das mit der Ausrichtung zu tun hat?

sejuma

Dein #wrapper für sich ist zentriert.
Du fügst ihm dann aber noch den #footer unten an und dann passen die absoluten Werte nicht mehr.

Integriere den #footer in den #wrapper (#wrapper erst nach dem #footer schließen). Berechne die gesamte Höhe und daraus die hälftigen Werte zum Zentrieren. Eine horizontale Zentrierung nach dieser Methode http://www.ohne-css.gehts-gar.net/0001.php ist besser als die absolute-Zentrierung und auf die vertikale würde ich an deiner Stelle verzichten

blueTiger

das horizontale Zentrieren ist nicht das Problem das kriege ich hin ich wollte es vertikal und es klappt nicht richtig.

Unregistriert

Zitat von sejuma
Versuch's mal so:
Code
#wrapper{
	background: #fae8fb url(../pictures/wrapper-top.jpg) no-repeat;
	position:absolute;
        ....
Größenunterschiede kann ich im FF und IE nicht feststellen.

Was ist nun eigentlich die neuere Art der Css:

background: alle sachen hier;

oder background-color: and background-image: and background-repeat:

Das weiß ich bis heute noch nicht. Spielt das eine Rolle?

sejuma

Beides ist richtig, ersteres ist nur die Kurzfassung.

Ich dachte erst, wenn nach background-image die Eigenschaft background-color folgt, würde das Hintergrundbild von der Hintergrundfarbe überlagert. Dem ist aber nicht so.

Tags