mit DIV feste und Scrollbaren bereichen erstellen

[Pain]

Hallo,

ich möchte mit DIV (nicht mit Framesets!!!) einen klassichen Seitenaufbau mit Header-DIV, Inhlat-DIV und Footer-DIV. Header und Footer sollen immer sichtbar sein, Inhalt soll scrollbar sein und sich in der Größe halt entsprechend anpassen.

Die CSS:

BODY {
  height:100%;
  overflow:hidden;
  background-color: #FFFFFF;
  color: #000000;
}

div.header
{
  height:10%;
  width:100%;
  padding:10px;
  margin:10px;
  background: url(../images/grau.gif);
  text-align: center;
}

div.inhalt
{
  height:100%;
  padding:10px;
  margin:10px;
  overflow:auto;
  background: url(../images/grau.gif);
  text-align: center;
}

div.footer
{
  height:3%;
  padding:10px;
  margin:10px;
  background: url(../images/grau.gif);
  text-align: center;
}

bei obigen CSS erscheint kein Scrollbalken. Warum ???

Wenn ich bei div.Inhalt die Höhe in Pixeln angebe (z.B. height:300px;) dann erscheint der Scrollbalken. Allerdings ist in keinem Fall der Footer immer Sichtbar.

Ich benötige bei der Höhe für den Inhalt unbedingt eine relative Angabe, also in Prozent. Wo mache ich was falsch ?

Besten Dank

pain

[kungschu]

Hallo pain.

Wenn ich bei div.Inhalt die Höhe in Pixeln angebe (z.B. height:300px;) dann erscheint der Scrollbalken. Allerdings ist in keinem Fall der Footer immer Sichtbar.

Ich benötige bei der Höhe für den Inhalt unbedingt eine relative Angabe, also in Prozent. Wo mache ich was falsch ?

Du suchst wohl position:fixed;. Beachte die Sonderbehandlung des IE.

MfG, Kungschu.

[Ingo Turski]

Hi,

Header und Footer sollen immer sichtbar sein, Inhalt soll scrollbar sein und sich in der Größe halt entsprechend anpassen.

warum willst Du ein wenig benutzerfreundliches Frameset mit CSS noch unfreundlicher nachbauen?

BODY {
  height:100%;
  overflow:hidden;

sofern ein Browser diese Höhenangabe überhaupt beachtet: warum willst Du überhängende Inhalte einfach ausblenden?

div.header
{
  height:10%;
  width:100%;
  padding:10px;
  margin:10px;

jetzt sind schon 10% + 20px Höhe (und 100% + 20px Breite) vergeben.

div.inhalt
{
  height:100%;
  padding:10px;
  margin:10px;

und jetzt sind es gar 210% + 40px.

div.footer
{
  height:3%;
  padding:10px;
  margin:10px;

und jetzt 213% + 60px.

bei obigen CSS erscheint kein Scrollbalken. Warum ???

vielleicht wegen overflow:hidden oder schlicht deshalb, weil der von Dir verwendete Browser  Deine Höhenangaben standardkonform nicht so umsetzt.

Allerdings ist in keinem Fall der Footer immer Sichtbar.

Dank overflow:hidden

Ich benötige bei der Höhe für den Inhalt unbedingt eine relative Angabe, also in Prozent. Wo mache ich was falsch ?

Du vergisst das Elternelement von body und rechnest auch noch verkehrt.

freundliche Grüße
Ingo

[Diorgle]

Schau mal ich hab da auch was vor mit div's, vielleicht bringt Dich das weiter:
http://www.tsvstein.com/new/aktive.html

bin nicht wirklich geübt, hab mir einiges zusammengeschnorrt.

Meine Frage an die Profis, warum ruckeln meine Bilder im IE??

Grüßle

Diorgle