nicht angemeldet
Hallo Ingo,
nochmal Danke für die prompte Antwort!
Naja, ist im Wesentlichen aus den Beispielen von SELFHTML zusammen gestellt
ich kenne hier kein Beispiel, das diese CSS-Eigenschaften so unpassend kombiniert.
http://aktuell.de.selfhtml.org/tippstricks/css/footer/index.htm
weil es für mich primär darum geht von meinem bisherigen "table-Desin" wegzukommen
Du hast Dir das neue Kapitel über CSS-basierte Layouts gründlich durchgelesen?
Sicher noch nicht alles und auch nicht alles sehr gründlich, aber ich arbeite daran :-)
und zentriere ich das dann,
nein; abgesehen davon, daß es bei 100% nichts zu zentrieren gibt: womit denkst Du tust Du das?
Darum sollte ja auch kein 100%, sondern 790px da stehen und mit "text-align: center;" sollte es zentriert werden , was zwar nicht ganz richtig war, für Header und Footer aber funktionierte!
Das ist sicher nicht wirklich gut, aber in meinem Fall kann man möglicherweise eine Beschränkung auf mind. 800x600 in Kauf nehmen.
Nein, bei einen solchen Fenster wird bereits ein Teil des Inhaltsbereichs und die komplette Navigation abgeschnitten.
Zur Not kommt halt noch optional ein Scrollbalken auf die Seite!
Das wird Dir bei dieser Konstruktion nicht gelingen.
Also ein DIV um die ganze Seite (inkl. Header und Footer) mit Angabe der Seitengröße in px und "margin: 0 auto;" (habe ich schon probiert und der Scrollbalken kommt auch bei zu kleinem Fenster, aber er scrollt nichts :-( )?
Das das Scrollrad im FF nicht funktioniert ist aber auch erstmal zweitrangig (was wäre dafür den die Lösung?).
Auf seiteninterne Scrollbalken verzichten!
Naja, eine Lösung ist das ja wohl eher nicht. Bei den angegebenen Beispielen mag das noch akzeptabel sein, in der Kontaktseite soll aber nur ein sehr kleiner Textbereich innerhalb des Content-DIV benutzt werden und dann muss da schon gescrollt werden!
Aber wie zentrieren ich das DIV im Browser?
Schau Dir die Beispiele im o.g. Selfhtml-Kapitel an.
Ich habe lange erfolglos nach passenden Beispielen gesucht (sonst hätte ich nicht im Forum nachgefragt), dank neuer Suchbegriffe bin ich aber heute fündig geworden: http://de.selfhtml.org/css/layouts/mehrspaltige.htm#zweispaltig_breite
Die Lösung ist im Wesentlichen:
body {
color:black; background-color:#BBBEC3;
font: normal 100.01% Helvetica, Arial, sans-serif;
margin: 0; padding: 1em 0;
text-align: center; /* Zentrierung im Internet Explorer */
}
...
#header_container {
position:fixed;
top:0; left:0; right:0;
width: 790px; height:99px;
text-align: left; /* Seiteninhalt wieder links ausrichten */
margin: 0 auto; /* standardkonforme horizontale Zentrierung */
z-index:2;
}
#header {
position:absolute;
top:0; left:0; right:0;
width: 100%; height:100%;
margin:0; padding:0;
background:#BBBEC3;
z-index:3;
}
#content_container {
position:fixed;
top:99px; left:0; right:0;
width: 790px; height:393px;
text-align: left; /* Seiteninhalt wieder links ausrichten */
margin: 0 auto; /* standardkonforme horizontale Zentrierung */
z-index:2;
}
#content_test1 {
position:absolute;
overflow:auto;
top:0; left:0; right:0; bottom:0;
width: 100%; height:100%;
background:#BBBEC3;
z-index:3;
}
...
..
Jetzt brauchts noch eine Lösung für die Scrollbalken und die Ausnahmen für den IE und dann sollte das schon klappen :-)
Vielen Dank,
Thorolf