Seite wird bei Scrollbalken abgeschnitten

[schutzgeist]

Hallo zusammen

Ich habe mal wieder ein Problem, wo ich nicht dahinter komme.

Ich habe eine Seite die horz. und vert. zentriert ist.
Wenn ich die Seite manuell zusammen schiebe und somit Scrollbalken erhalte, dann schneidet es mir die Seite oben einfach ab. Nach unten kann ich noch Scrollen.

Hier die Frage: wieso?

CSS:

* {
margin: 0;
padding: 0;
}
body {
height: 100%;
width: 100%;
}
div {
position: absolute;
width: 864px;
height: 572px;
top: 50%;
left: 50%;
margin-left: -432px;
margin-top: -286px;
background: #0F0;
border: 2px solid #000;
}

HTML:

<div id="div"><img src="t.jpg" width="864" height="572" /></div>

Vielen Dank schonmal

 

[hela]

... Hier die Frage: wieso?

Hallo,

das ist völlig normales Verhalten der Browser: Wenn du ein absolut positioniertes Blockelement nach links oder oben außerhalb des Browserfensters verlegst, dann ist das (u.U. partiell) raus aus dem Fenster. Das kann man auch ausnutzen, wenn bestimmte Elemente z.B. nur im hover-Zustand sichtbar sein sollen ...

Du müsstest also die horizontale Zentrierung mit der Eigenschaft {margin: 0 auto;} im DIV-Selektor machen und die vertikale Zentrierung kannst du mit einem zusätzlichen unsichtbaren DIV-Block vornehmen - so wie das hier gezeigt wird. Eine Beschreibung dafür ist hier [http://www.ohne-css.gehts-gar.net/0002.php] im 2. Abschnitt ("Die sichere Zentriermethode") zu finden.

 

[schutzgeist]

Hallo,

das sieht doch schonmal vielversprechend aus. Prima

Dann versuch ich das ganze mal entsprechend in meine Seite um- und einzubauen.

Danke schonmal!